Android Canvas的使用

1.Canvas基本绘制
1.1drawLine 绘制直线

public class MyView extends View {

    public MyView(Context context) {
        super(context);
    }

    public MyView(Context context,
            @Nullable AttributeSet attrs) {
        super(context, attrs);
        /**
         *Paint最好在结构体中绘制
         *这里创建
         */
        //Paint paint = new Paint();
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        //绘制直线
        /**
         * Paint最好在结构体中绘制
         * 避免在onDraw中重复绘制
         */
        Paint paint = new Paint();
        paint.setColor(Color.RED);
        paint.setStyle(Style.FILL);
        paint.setStrokeWidth(5);

        canvas.drawLine(0, 0, 300, 300, paint);
    }
}

1.2drawLines 绘制虚线
    Paint paint = new Paint();
        paint.setColor(Color.RED);
        paint.setStyle(Style.FILL);
        paint.setStrokeWidth(5);

        //canvas.drawLine(0, 0, 300, 300, paint);
        float[] pts = {0,0,100,100,200,200,300,300};
        canvas.drawLines(pts,paint);
1.3drawPoints 绘制点

        Paint paint = new Paint();
        paint.setColor(Color.RED);
        paint.setStyle(Style.FILL);
        paint.setStrokeWidth(10);

        //canvas.drawLine(0, 0, 300, 300, paint);
        float[] pts = {0,0,100,100,200,200,300,300};
        //canvas.drawLines(pts,paint);
        canvas.drawPoints(pts,paint);

1.4drawRect 绘制矩形
        Paint paint = new Paint();
        paint.setColor(Color.RED);
        paint.setStyle(Style.FILL);
        paint.setStrokeWidth(10);
        RectF rectF = new RectF(100,100,400,500);
        canvas.drawRect(rectF,paint);

1.5drawRoundRect 绘制圆角矩形
      Paint paint = new Paint();
      paint.setColor(Color.RED);
      paint.setStyle(Style.FILL);
      paint.setStrokeWidth(10);
      RectF rectF = new RectF(100,100,400,500);

      /**
       * x-radius , y-radius圆角的半径
       * 半径30
       */
      canvas.drawRoundRect(rectF,30,30,paint);

1.6drawCircle 绘制圆形
        Paint paint = new Paint();
        paint.setColor(Color.RED);
        paint.setStyle(Style.FILL);
        paint.setStrokeWidth(10);

        /**
         * @param cx 圆心点x坐标
         * @param cy 圆心点y坐标
         * @param radius 圆点半径
         * @param paint The paint used to draw the circle
         */
        canvas.drawCircle(200,200,100,paint);

1.7drawOval绘制椭圆
        Paint paint = new Paint();
        paint.setColor(Color.RED);
        /**
         * 设置空心圆
         */
        paint.setStyle(Style.STROKE);
        paint.setStrokeWidth(15);


        RectF rectF = new RectF(100,100,400,500);

        canvas.drawRect(rectF,paint);

        paint.setColor(Color.GREEN);
        /**
         * 默认内切圆
         */
        canvas.drawOval(rectF,paint);

1.8drawArc绘制弧线
     Paint paint = new Paint();
        paint.setColor(Color.RED);
        /**
         * 设置空心圆
         */
        paint.setStyle(Style.STROKE);
        paint.setStrokeWidth(15);

        RectF rectF = new RectF(100, 100, 400, 500);

        canvas.drawRect(rectF, paint);

        paint.setColor(Color.GREEN);
        /**
         * @param oval The bounds of oval used to define the shape and size of the arc
         * @param startAngle 起始角度，相对X轴正方向
         * @param sweepAngle 画多少角度的弧度
         * @param useCenter boolean，false:只有一个纯弧线 true：闭合的边
         * @param paint The paint used to draw the arc
         */
        canvas.drawArc(rectF,0,90,true,paint);

1.9drawPath 绘制路径
        Paint paint = new Paint();
        paint.setColor(Color.RED);
        paint.setStyle(Style.STROKE);
        paint.setStrokeWidth(15);

        Path path = new Path();
        path.moveTo(100, 100);//画笔落笔的位置
        //移动
        path.lineTo(200,100);
        path.lineTo(200,200);



        canvas.drawPath(path, paint);
        //圆角矩形路径

        Path path2 = new Path();
        path2.moveTo(300, 100);//画笔落笔的位置
        //移动
        path2.lineTo(400,100);
        path2.lineTo(400,200);
        //自动闭合
        path2.close();

        canvas.drawPath(path2, paint);

        Paint paint = new Paint();
        paint.setColor(Color.RED);
        paint.setStyle(Style.STROKE);
        paint.setStrokeWidth(15);

        Path path = new Path();


        RectF rectF = new RectF(100, 100, 400, 500);

        //圆角矩形路径
        float radius[] ={10,10,10,10,10,10,90,90};
        path.addRoundRect(rectF,radius,Direction.CCW);
        canvas.drawPath(path,paint);

1.10区域迭代器RegionIterator的使用
        Paint paint = new Paint();
        paint.setColor(Color.RED);
        paint.setStyle(Style.STROKE);
        paint.setStrokeWidth(15);

        RectF rectF = new RectF(100, 100, 400, 500);

        Region region = new Region(100, 100, 200, 200);


        Path path = new Path();
        path.addOval(rectF,Direction.CCW);

        Region region1 = new Region();
        //path的矩形与椭圆取交集的结果
        region1.setPath(path,region);
        //创建一块矩形的区域
        //结合区域迭代器的使用
        RegionIterator iterator = new RegionIterator(region1);

        Rect rect = new Rect();

        while (iterator.next(rect)) {
            canvas.drawRect(rect, paint);
        }

        Paint paint = new Paint();
        paint.setColor(Color.RED);
        paint.setStyle(Style.STROKE);
        paint.setStrokeWidth(1);

        RectF rectF = new RectF(100, 100, 400, 500);

        Region region = new Region(100, 100, 400, 500);


        Path path = new Path();
        path.addOval(rectF,Direction.CCW);

        Region region1 = new Region();
        //path的矩形与椭圆取交集的结果
        region1.setPath(path,region);
        //创建一块矩形的区域
        //结合区域迭代器的使用
        RegionIterator iterator = new RegionIterator(region1);

        Rect rect = new Rect();

        while (iterator.next(rect)) {
            canvas.drawRect(rect, paint);
        }

注意：灰色是屏幕截图的原因
2.Canvas变换技巧
2.1translate 平移

        Paint paint = new Paint();
        paint.setColor(Color.RED);
        paint.setStyle(Style.STROKE);
        paint.setStrokeWidth(15);
 Paint paint = new Paint();
    paint.setColor(Color.RED);
    paint.setStyle(Style.STROKE);
    paint.setStrokeWidth(15);

    RectF rectF = new RectF(100, 100, 400, 500);
    canvas.drawRect(rectF, paint);
    paint.setColor(Color.BLUE);
    //将画布平移
    canvas.translate(50, 50);
    //当canvas执行drawXXX的时候就会创建一个新的画布，但是还是会沿用之前设置的平移变换。不可逆的。（save和restore）
    canvas.drawRect(rectF, paint);

2.2scale缩放

  Paint paint = new Paint();
    paint.setColor(Color.RED);
    paint.setStyle(Style.STROKE);
    paint.setStrokeWidth(15);
    RectF r = new RectF(0,0,400,500);
    canvas.drawRect(r,paint);
    paint.setColor(Color.BLUE);
    /**
     * sx,sy:分别对x/y方向的一个缩放系数
     * 画布的缩放会导致里面所有的绘制的东西否会有一个缩放的效果
     */
    canvas.scale(1.5f,0.5f);
    canvas.drawRect(r,paint);

2.3rotate旋转

  Paint paint = new Paint();
    paint.setColor(Color.RED);
    paint.setStyle(Style.STROKE);
    paint.setStrokeWidth(15);

    RectF rectF = new RectF(200, 200, 400, 500);
    canvas.drawRect(rectF, paint);
    paint.setColor(Color.BLUE);
    /**
     * canvas.rotate(45,200, 200);
     * 以(200,200)为原点旋转
     */
    canvas.rotate(45, 200, 200);
    canvas.drawRect(rectF, paint);

2.4skew斜拉画布

  Paint paint = new Paint();
    paint.setColor(Color.RED);
    paint.setStyle(Style.STROKE);
    paint.setStrokeWidth(15);

    RectF r = new RectF(100,100,400,500);
    canvas.drawRect(r,paint);
    paint.setColor(Color.BLUE);
    //sx,sy倾斜度：X轴方向上倾斜60度，tan60=根号3
    canvas.skew(1.73f,0);
    canvas.drawRect(r,paint);

2.5clipRect裁剪

 Paint paint = new Paint();
    paint.setColor(Color.RED);
    paint.setStyle(Style.STROKE);
    paint.setStrokeWidth(15);
    RectF r = new RectF(200,200,400,500);
    canvas.drawRect(r,paint);
    paint.setColor(Color.BLUE);
    canvas.clipRect(new Rect(250,250,300,400));
    canvas.drawColor(Color.GREEN);