在自定义view中, 绘制各种几何图形的开发精要.

一点感想

开发中, 其实经常会碰到这种情况, 拿到一个文件几百上千行的代码, 到处是各种对framework的API调用, 如果对这些API调用的作用理解不清晰, 就会造成各种困扰, 不断的去用google查排疑解惑, 打乱自己的思绪, 对理解整个的代码逻辑造成不小的困扰. 相反, 如果对这些API调用的作用理解清晰的话, 那就能快速的找到代码中的重点位置, 脑子里能快速想象出这段代码要干的大体是什么事情, 这样就能快速的理解透原来的代码逻辑, 进而添加自己要实现的功能.
而有些不常用的代码,

        Shader mShader = new LinearGradient(0, 0, 100, 100, new int[]{
                Color.RED, Color.GREEN, Color.BLUE, Color.YELLOW}, null,
                Shader.TileMode.MIRROR);
        paint.setShader(mShader);

像这样的, 平时如果不进行知识积累的话, 阅读到这里就会卡下来, 生怕这是关键的代码逻辑, 被自己遗漏掉, 思绪就会因此被打乱. 反过来说, 如果对framework 的API很熟悉, 那就能快速过滤"无用"代码, 定位在代码中的关键逻辑中.
所以说, 在工作之余, 一定要抽出些时间, 进行知识上的积累, 对技术成长很有帮助.
在PC上建一个文件夹, 保存好各开发要点的代码片段.

/home/wangxin/src/my_code_base
例子代码
package net.qihoo.launcher.widget.clockweather.components;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.LinearGradient;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.PixelFormat;
import android.graphics.RectF;
import android.graphics.Shader;
import android.view.View;
import android.view.WindowManager;

/*
1. 外界的调用方法, 让这个子定义view 直接添加到WindowManager中去.
        MyView myView = new MyView(mContext);
        myView.show();

要准确理解几个基本概念.
2. Canvas: 画布, 任何图形都是在画布上画出来的.
调用canvas.draw*() 系列方法, 在画布上绘制几何图形.
3. Paint: 画笔, 可以指定画笔的颜色, 宽度等值, 调用canvas.draw*() 系列方法都需要传入Paint类的对象进去才行.
//作用是去锯齿, 因为屏幕上的图形都是由方形的像素组成, 如果不调用这个方法的话, 在绘制斜线的时候就会看到明显的锯齿情况出现.
paint.setAntiAlias(true);

3. Path类, 描述的是一个绘制的路径信息.
        Path path = new Path();
        path.moveTo(10, 330);
        path.lineTo(70, 330);
        path.lineTo(40, 270);
        path.close();
        canvas.drawPath(path, paint);
4. Shader类, 描述的是渐变颜色的信息.
    调用Paint的setShader(mShader);的目的是为这个画笔设置渐变颜色.
        Shader mShader = new LinearGradient(0, 0, 100, 100, new int[]{
                Color.RED, Color.GREEN, Color.BLUE, Color.YELLOW}, null,
                Shader.TileMode.MIRROR);
        paint.setShader(mShader);

*/


public class MyView extends View {

    WindowManager wm;
    private WindowManager.LayoutParams params;

    public MyView(Context context) {
        super(context);
        wm = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);
        params = new WindowManager.LayoutParams(WindowManager.LayoutParams.MATCH_PARENT, WindowManager.LayoutParams.MATCH_PARENT,
                WindowManager.LayoutParams.TYPE_APPLICATION_PANEL,
                WindowManager.LayoutParams.FLAG_LAYOUT_IN_SCREEN /*| WindowManager.LayoutParams.FLAG_BLUR_BEHIND*/,
                PixelFormat.TRANSLUCENT);
        params.softInputMode = WindowManager.LayoutParams.SOFT_INPUT_STATE_UNSPECIFIED | WindowManager.LayoutParams.SOFT_INPUT_ADJUST_PAN;
        params.windowAnimations = android.R.style.Animation_Dialog;
    }

    //会在组件加载时调用
    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        /* 设置背景为白色 */
        canvas.drawColor(Color.WHITE);
        Paint paint = new Paint();//创建画笔
        /* 去锯齿 */
        paint.setAntiAlias(true);
        /* 设置paint的颜色 */
        paint.setColor(Color.RED);
        /* 设置paint的 style 为STROKE:空心 */
        paint.setStyle(Paint.Style.STROKE);
        /* 设置paint的外框宽度 */
        paint.setStrokeWidth(3);
        /* 画一个空心圆形 */
        //参数:圆心x,圆心y,半径r,paint
        canvas.drawCircle(40, 40, 30, paint);
        /* 画一个空心正方形 */
        //参数:left top right bottom ,当right-left等于bottom-top就为正方形 canvas.drawRect(10, 90, 70, 150, paint);
        /* 画一个空心长方形 */
        canvas.drawRect(10, 170, 70, 200, paint);
        /* 画一个空心椭圆形 */
        RectF re = new RectF(10, 220, 70, 250);
        canvas.drawOval(re, paint);

        /* 画一个空心三角形 */
        Path path = new Path();
        path.moveTo(10, 330);
        path.lineTo(70, 330);
        path.lineTo(40, 270);
        path.close();
        canvas.drawPath(path, paint);
        /* 画一个空心梯形 */
        Path path1 = new Path();
        path1.moveTo(10, 410);
        path1.lineTo(70, 410);
        path1.lineTo(55, 350);
        path1.lineTo(25, 350);
        path1.close();
        canvas.drawPath(path1, paint);
        /* 设置paint 的style为 FILL:实心 */
        paint.setStyle(Paint.Style.FILL);
        /* 设置paint的颜色 */
        paint.setColor(Color.BLUE);
        /* 画一个实心圆 */
        canvas.drawCircle(120, 40, 30, paint);
        /* 画一个实心正方形 */
        canvas.drawRect(90, 90, 150, 150, paint);
/* 画一个实心长方形 */
        canvas.drawRect(90, 170, 150, 200, paint);
/* 画一个实心椭圆 */
        RectF re2 = new RectF(90, 220, 150, 250);
        canvas.drawOval(re2, paint);
/* 画一个实心三角形 */
        Path path2 = new Path();
        path2.moveTo(90, 330);
        path2.lineTo(150, 330);
        path2.lineTo(120, 270);
        path2.close();
        canvas.drawPath(path2, paint);
        /* 画一个实心梯形 */
        Path path3 = new Path();
        path3.moveTo(90, 410);
        path3.lineTo(150, 410);
        path3.lineTo(135, 350);
        path3.lineTo(105, 350);
        path3.close();
        canvas.drawPath(path3, paint);
        /* 设置渐变色 */
        /*
        LinearGradient shader = new LinearGradient(0, 0, endX, endY, new int[]{startColor, midleColor, endColor},new float[]{0 , 0.5f, 1.0f}, TileMode.MIRROR);
        参数一为渐变起初点坐标x位置,参数二为y轴位置,参数三和四分别对应渐变终点
        其中参数new int[]{startColor, midleColor, endColor}是参与渐变效果的颜色集合,
        其中参数new float[]{0 , 0.5f, 1.0f}是定义每个颜色处于的渐变相对位置, 这个参数可以为null,如果为null表示所有的颜色按顺序均匀的分布
        最后参数为平铺方式,这里设置为MIRROR镜像(REPEAT重复)
        */
        Shader mShader = new LinearGradient(0, 0, 100, 100, new int[]{
                Color.RED, Color.GREEN, Color.BLUE, Color.YELLOW}, null,
                Shader.TileMode.MIRROR);
        paint.setShader(mShader);
        /* 画一个渐变色圆 */
        canvas.drawCircle(200, 40, 30, paint);
        /* 画一个渐变色正方形 */
        canvas.drawRect(170, 90, 230, 150, paint);
        /* 画一个渐变色长方形 */
        canvas.drawRect(170, 170, 230, 200, paint);
        /* 画一个渐变色椭圆 */
        RectF re3 = new RectF(170, 220, 230, 250);
        canvas.drawOval(re3, paint);
        /* 画一个渐变色三角形 */
        Path path4 = new Path();
        path4.moveTo(170, 330);
        path4.lineTo(230, 330);
        path4.lineTo(200, 270);
        path4.close();
        canvas.drawPath(path4, paint);
        /* 画一个渐变色梯形 */
        Path path5 = new Path();
        path5.moveTo(170, 410);
        path5.lineTo(230, 410);
        path5.lineTo(215, 350);
        path5.lineTo(185, 350);
        path5.close();
        canvas.drawPath(path5, paint);
        /* 写字 */
        paint.setTextSize(24);
        canvas.drawText("圆形", 240, 50,
                paint);
        canvas.drawText("正方形", 240, 120,
                paint);
        canvas.drawText("长方形", 240, 190,
                paint);
        canvas.drawText("椭圆形", 240, 250,
                paint);
        canvas.drawText("三角形", 240, 320,
                paint);
        canvas.drawText("梯形", 240, 390,
                paint);
    }
    public void show() {
        wm.addView(this, params);
    }
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,324评论 5 476
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,303评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,192评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,555评论 1 273
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,569评论 5 365
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,566评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,927评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,583评论 0 257
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,827评论 1 297
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,590评论 2 320
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,669评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,365评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,941评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,928评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,159评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,880评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,399评论 2 342

推荐阅读更多精彩内容