android view画线 android 画图

路径是画图最重要的部分，类似于PS的钢笔工具，可以对图像、文字进行路径处理！基本上Android的自定义View都是用路径画出来的！

如果对基础不熟悉的同学，可以看我的另一篇博客：Android学习之——Canvas画图，里面对各个参数有详细的解析
首先，初始化画笔属性！

private void init() {
        //初始化画笔
        mPaint = new Paint();
        mPaint.setTextSize(100);
        mPaint.setColor(Color.RED);
        mPaint.setStyle(Paint.Style.STROKE);
        mPaint.setTextSize(100);     //单位为 sp
        mPaint.setStrokeWidth(10);
        path = new Path();
    }

我们来看一下使用到的函数

moveTo (float x, float y)：直线的开始点（也可能是下一个形状的开始点）即将直线路径的绘制位置定在（x,y）的位置；

lineTo (float x2, float y2)：结束点或者下一次绘制直线路径的开始点；

close ()：如果绘制的直线没有形成闭环，调用Close()会将路径首尾点连接起来，形成闭环；

moveTo(float x2, float y2)：重新开始绘制另一图形

arcTo（RectF rectF , int startAngle , int sweepAngle , boolean forceMoveTo）：重新绘制圆（不连接）

addPath(Path src, float dx, float dy)进行了位移之后再添加进当前path中。

addPath（Path）将两个Path合并成为一个。

addPath(Path src, Matrix matrix)添加到当前path之前先使用Matrix进行变换。

moveTo

先简单画一个梯形：

path.moveTo(100, 200);
        path.lineTo(200, 200);
        path.lineTo(300, 400);
        path.lineTo(0, 400);
        path.close();
        canvas.drawPath(path, mPaint);

再画一条曲线

path.moveTo(100,70);
        path.lineTo(140,180);
        path.lineTo(250,330);
        path.lineTo(400,630);
        path.lineTo(100,830);
        canvas.drawPath(path , mPaint);

close()

在上面那条曲线中，加上close()方法试一下

moveTo（）

由此可见，当添加close()方法之后，最后一个点会和起点相连！接下开我们看一下moveTo(float x2, float y2)方法

path.moveTo(100,70);
        path.lineTo(140,180);
        path.lineTo(250,330);
        path.lineTo(400,630);
        path.lineTo(100,830);
        path.moveTo(300 ,500);
        path.lineTo(520 ,650);
        canvas.drawPath(path , mPaint);

没什么太大难度，就是重新开始绘制另一段直线，接下来画一段弧形！

RectF rectF = new RectF(200 , 200 ,500 ,500);
//        RectF rectF = new RectF(左上角X轴 , 左上角Y轴 ,右下角X轴 ,右下角Y轴);
        path.addArc(rectF , 90 , 180);
//        path.addArc(rectF , 起点角度 , 所画角度);
        canvas.drawPath(path , mPaint);

arcTo(）

使用arcTo(）方法！

RectF rectF = new RectF(200 , 200 ,500 ,500);
path.moveTo(0 , 0);
path.lineTo(100,100);
path.arcTo(rectF ,0 ,270 ,true);
canvas.drawPath(path,mPaint);

以上是arcTo()方法第四个参数为true和false的区别，设置为true的话，则起点和终点不会相连，反之则相连！

addOval（）

接下来我们用路径来画椭圆

RectF rectF = new RectF(200 , 200 ,400 ,600);
path.addOval(rectF , Path.Direction.CW);
canvas.drawPath(path , mPaint);

其中的原理也就是先画一个长方形，在长方形中画椭圆！

addPath(）-1

接下来我们看一下addPath(）这个方法，顾名思义，即在上一段路径上加上一段路径，和moveTo（）方法差不多

path.moveTo(100, 200);
path.lineTo(200, 200);
path.lineTo(300, 400);
path.lineTo(0, 400);
//新建一段路径
Path newPath = new Path();
newPath .moveTo(100,1000);
newPath .lineTo(600,1300);
newPath .lineTo(400,1700);
//将新建的路径添加到主路径中
path.addPath(newPath);
canvas.drawPath(path , mPaint);

addPath(）-2

上面的代码保持不变，我们在addPath第一个参数后面加上两个参数，试一下效果

path.addPath(newPath , 100 ,200);
//        path.addPath(newPath , X轴偏移 ,Y轴偏移);

和上图相比较，第二段路径往左边移动了100SP ，往右边移动了200SP

addPath(）-3

path.moveTo(100, 200);
        path.lineTo(200, 200);
        path.lineTo(300, 400);
        path.lineTo(0, 400);
 Path newPath = new Path();
        newPath.moveTo(100, 1000);
        newPath.lineTo(600, 1300);
        newPath.lineTo(400, 1700);
        Matrix matrix = new Matrix();
        matrix.postScale(0.5f,0.5f);
        path.addPath(newPath , matrix);
        canvas.drawPath(path, mPaint);

Matrix也很容易理解，也是偏移量的意思，由此可以发现，第二条路径的长和宽均偏移量0.5f

addRoundRectO()

RectF rectF5 = new RectF(200, 800, 700, 1200);
        path.addRoundRect(rectF5, 50,20,Path.Direction.CCW);
//        path.addRoundRect(rectF5, X轴圆角大小,Y轴圆角大小,样式);
        canvas.drawPath(path, mPaint);

当然，也可以自定义每一个圆角的角度

RectF rectF5 = new RectF(200, 800, 700, 1200);
        float[] react = {10,20,0,15,20,30,12,32};
        path.addRoundRect(rectF5, react,Path.Direction.CCW);
//        path.addRoundRect(rectF5, 圆角数组 ,样式);
        canvas.drawPath(path, mPaint);

 quadTo cubicTo 曲线

path.moveTo(300,500);
        path.quadTo(500,100,800,500);
        canvas.drawPath(path, mPaint);