Android自定义View思路洗脑

每日一言：心如巨石，风吹不动。

欢迎一起讨论和学习，QQ：732258496  QQ群：478720016

      学任何知识，技能，思路至关重要，授人以鱼不如授人以渔，秉承这个思想把自己学到的通过先渐进思路的形式分享给大家。总体了解学习Android自定义View，让小伙伴们再也不感到陌生,实现如下图所示。

之前写的两篇博客如下:

自定义控件之绘图篇（一）

自定义控件之绘图篇（二）

一.文章重点罗列（上图，一目了然）

二.基本概念共8点（以下讲解不容易理解的概念，其它可自行查阅）

  1.设置阴影 ，这个方法不支持硬件加速，所以我们要测试时必须先关闭硬件加速。那么请加上setLayerType(LAYER_TYPE_SOFTWARE, null); 并且确保你的最小api8以上。

setShadowLayer(float radius, float dx, float dy, int shadowColor) 

    2.画多条直线

drawLines(@Size(min=4,multiple=2) float[] pts, int offset, int count, Paint paint)

   参数： 

   pts : 是点的集合且大小最小为4而且是2的倍数。表示每2个点连接形成一条直线，pts 的组织方式为{x1,y1,x2,y2….}
   offset : 集合中跳过的数值个数，注意不是点的个数！一个点是两个数值
   count : 参与绘制的数值的个数，指pts[]里数值个数，而不是点的个数，因为一个点是两个数值 

    3.圆弧

drawArc(@NonNull RectF oval, float startAngle, float sweepAngle, boolean useCenter， @NonNull Paint paint)

  参数：

  oval ： 生成椭圆的矩形
  startAngle ： 弧开始的角度 （X轴正方向为0度，顺时针弧度增大）
  sweepAngle ： 绘制多少弧度 （注意不是结束弧度）
  useCenter ： 是否有弧的两边 true有两边 false无两边

    4.Path---close（）

     注意：close的作用的封闭路径，如果连接最后一个点和最初一个点任然无法形成闭合的区域，那么close什么也不做。

   5.贝塞尔曲线：线条之美。

   6.Direction是一个枚举类型（Enum）分别有CW（顺时针），CCW（逆时针）两个常量

   7.addArc与arcTo

addArc(float left, float top, float right, float bottom, float startAngle, float sweepAngle)
arcTo(float left, float top, float right, float bottom, float startAngle, float sweepAngle, boolean forceMoveTo)

 startAngle表示开始圆弧度数（0度与X轴方向对齐，顺时针移动，弧度增大）。

   注意：sweepAngle表示运动了多少弧度，并不是结束弧度。

 8.字体设置：设置楷体根本没起作用，在系统的字体当中没有找到楷体。

三.最上图房子绘制思路以及代码

    1.知识点

    Paint / Canvas  / moveTo / lineTo 等

    2.构造方法自己加（一定要懂为什么加构造方法，它的作用是什么，多问几个为什么）

 

public class CustomView extends View {
    Paint paint;//画布
    Canvas canvas;//画笔

    public CustomView(Context context) {
        super(context);
        paint = new Paint();
        canvas = new Canvas();
    }

    @Override
    public void draw(Canvas canvas) {
        super.draw(canvas);
        paint.setStyle(Paint.Style.STROKE);
        paint.setStrokeWidth(5);
        paint.setColor(Color.parseColor("#FF0000"));

        RectF rectFangzi = new RectF(200, 800, 900, 1300);//房子长方形
        RectF rectYan = new RectF(300, 500, 400, 750);//烟筒长方形
        RectF rectTian = new RectF(250, 1000, 450, 1200);//窗户正方形
        RectF rectMen = new RectF(600, 900, 800, 1300);//门长方形

        Path path = new Path();
        path.addRect(rectFangzi, Path.Direction.CW);
        //画三角形
        Path pathSanJiao = new Path();
        pathSanJiao.moveTo(200, 800);
        pathSanJiao.lineTo(550, 550);
        pathSanJiao.lineTo(900, 800);
        pathSanJiao.close();
        pathSanJiao.addRect(rectYan, Path.Direction.CW);
        //画田字格
        Path pathTian = new Path();
        pathTian.moveTo(250, 1100);
        pathTian.lineTo(450, 1100);
        pathTian.moveTo(350, 1200);
        pathTian.lineTo(350, 1000);


        //画门
        Path pathMen = new Path();
        pathMen.moveTo(700, 900);
        pathMen.lineTo(700, 1300);
        //画烟圆圈
        Path pathYuan = new Path();
        pathYuan.addCircle(300, 430, 50, Path.Direction.CW);

        path.addPath(pathSanJiao);
        path.addPath(pathYuan);
        path.addRect(rectTian, Path.Direction.CW);
        path.addPath(pathTian);
        path.addRect(rectMen, Path.Direction.CW);
        path.addPath(pathMen);
        canvas.drawPath(path, paint);
    }
}

四.文字绘制思路以及代码

    1.注意：drawTextRun方法是在 skd23 才引入的方法

    2.构造方法自己加（一定要懂为什么加构造方法，它的作用是什么，多问几个为什么）

 

public class CustomView extends View {
    Paint mPaint;//画笔
    Canvas canvas;//画布

    public CustomView(Context context) {
        super(context);
        mPaint = new Paint();
        canvas = new Canvas();
    }
    @Override
    public void draw(Canvas canvas) {
        super.draw(canvas);
        int baseLineY = 200;
        mPaint.setTextSize(120);
        canvas.drawText("Tom的温馨小屋", 200, baseLineY, mPaint);
        Paint.FontMetrics fontMetrics = mPaint.getFontMetrics();
        float top = fontMetrics.top + baseLineY;
        float ascent = fontMetrics.ascent + baseLineY;
        float descent = fontMetrics.descent + baseLineY;
        float bottom = fontMetrics.bottom + baseLineY;

        //绘制基线
        mPaint.setColor(Color.parseColor("#FF1493"));
        canvas.drawLine(0, baseLineY, getWidth(), baseLineY, mPaint);

        //绘制top直线
        mPaint.setColor(Color.parseColor("#FFB90F"));
        canvas.drawLine(0, top, getWidth(), top, mPaint);

        //绘制ascent直线
        mPaint.setColor(Color.parseColor("#b03060"));
        canvas.drawLine(0, ascent, getWidth(), ascent, mPaint);

        //绘制descent直线
        mPaint.setColor(Color.parseColor("#912cee"));
        canvas.drawLine(0, descent, getWidth(), descent, mPaint);

        //绘制bottom直线
        mPaint.setColor(Color.parseColor("#1E90FF"));
        canvas.drawLine(0, bottom, getWidth(), bottom, mPaint);

        canvas.save();
        mPaint.setColor(Color.RED);
    }
}

五.总结

     学习新的东西同时，不忘联想以前的知识，让学会的知识融汇贯通起来，如这次学习View就会想起四五大组件，消息传递，异步，线程，内存泄漏等知识。一起学习，一起进步，住各位伙伴前途似锦。