上一篇内容自定义View（Canvas）
http://www.jianshu.com/p/d25fb10ad34e

Path这东西，这东西太麻烦了，牵扯的东西很多。但是又特别重要，所以一定要写，思路不清晰的地方回头再整理吧。

前面我们已经用canvas的drawXxx()方法绘制了一些简单的基本图形，但这显然远远不能满足我们的需求。比如我们想绘制一些稍微复杂一点(如绘制一个心形 正多边形 五角星等)的图形就没法去绘制，而使用Path不仅能够绘制简单图形，也可以绘制这些比较复杂的图形。另外，根据路径绘制文本和剪裁画布都会用到Path。以下是Path类中常用到的方法:

注意：我们可以把path看成是存储操作轨迹的一个容器，我们把希望进行的操作轨迹记录在path中。由Canvas的drawPath()方法把path记录的图形真正绘制到画布上

然后我们简单的把path分一个类：

接下来看看path的一些主要方法

xxxTo()系列

xxxTo家族成员主要有：

public void moveTo(float x, float y)
public void lineTo(float x, float y)
public void quadTo(float x1, float y1, float x2, float y2)
public void cubicTo(float x1, float y1, float x2, float y2, float x3, float y3)  
public void arcTo (RectF oval, float startAngle, float sweepAngle,boolean forceMoveTo)  

moveTo()

将绘制的起点移动到某处，打个比方，比如要写字，moveTo()方法则是把笔尖移动到纸的相应位置，准备开始书写

lineTo()

在上一次操作结束的点与参数坐标点之间连一条线

protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.translate(getWidth()/2,getHeight()/2);

        //绘制坐标系
        float [] pts = new float[]{0,0,mWidth/2,0,0,0,0,mHeight/2};
        mPaint.setColor(Color.BLACK);
        canvas.drawLines(pts,mPaint);

        Path path = new Path();// 创建Path

        path.moveTo(100,100);//移动绘制点
        path.lineTo(200,100);//从(100,100)位置画一条线到(200,100)位置
        path.lineTo(200,200);//从(200,100)位置画一条线到(200,200)位置
        //path.close();闭合区域

        mPaint.setColor(Color.RED);
        mPaint.setStrokeWidth(15);
        canvas.drawPath(path, mPaint);// 绘制Path
    }

通过两次lineTo()方法绘制了两条线段:

//path.close();

这一句代码的注释，显示如下：

arcTo()

这是一个画弧线的方法，原理是从一个椭圆上截取一段弧

public void arcTo (RectF oval, float startAngle, float sweepAngle,boolean forceMoveTo)

这个方法（还有两个重载方法，大同小异，这里只讲这一个）有四个参数：
RectF oval：用于确定椭圆（重要说明:该RectF 的4个参数必须遵从left，top，right，bottom的顺序，否则无法画出弧线）
float startAngle：起始角度
float sweepAngle：扫过的角度，顺时针方向为正
boolean forceMoveTo：用于确定是否与上一点连接（是否抬起笔）

这样说可能有点抽象,看代码：

protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.translate(getWidth()/2,getHeight()/2);

        //绘制坐标系
        float [] pts = new float[]{0,0,mWidth/2,0,0,0,0,mHeight/2};
        mPaint.setColor(Color.BLACK);
        canvas.drawLines(pts,mPaint);

        RectF rectF = new RectF(0,0,300,200);//用于绘制椭圆

        Path path = new Path();// 创建Path

        path.moveTo(0,0);
        path.arcTo(rectF,0,60,false);//截取0度到60度之间的弧

        mPaint.setColor(Color.RED);
        canvas.drawPath(path, mPaint);// 绘制Path
    }

因为这里forceMoveTo参数设置为false，所以不抬起笔（连接上一点）。

如果把forceMoveTo参数设置为true（抬起笔）：

最后，quadTo()和cubicTo()方法是分别绘制二阶和三阶贝塞尔曲线的方法,我们先了解一下贝塞尔曲线

什么叫贝赛尔曲线？其实很简单，使用三个或多个点来确定的一条曲线，贝塞尔曲线在图形图像学中有相当重要的地位，Path中也提供了一些方法来给我们模拟低阶贝赛尔曲线。
贝塞尔曲线的定义也比较简单，你只需要一个起点、一个终点和至少零个控制点则可定义一个贝赛尔曲线，当控制点为零时，只有起点和终点，此时的曲线说白了就是一条线段，我们称之为一阶贝赛尔曲线。
PS：以下图片和公式均来自维基百科和互联网

一阶贝赛尔曲线：

二阶贝赛尔曲线：

三阶贝赛尔曲线：

高阶贝塞尔曲线：
四阶：

quadTo()

quadTo方法有四个参数，前两个参数为控制点的坐标，后两个参数为终点坐标，至于起点默认是画布的左上角。这里的屏幕中心就是起点，(x1,y1)就是中点P1，(x2,y2)就是末端点P2。
看一下代码：

protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.translate(getWidth()/2,getHeight()/2);

        //绘制坐标系
        float [] pts = new float[]{0,0,mWidth/2,0,0,0,0,mHeight/2};
        mPaint.setColor(Color.BLACK);
        canvas.drawLines(pts,mPaint);

        Path path = new Path();// 创建Path

        path.quadTo(100,100,200,0);//绘制二阶贝塞尔曲线

        mPaint.setColor(Color.RED);
        canvas.drawPath(path, mPaint);// 绘制Path

        mPaint.setColor(Color.BLUE);
        mPaint.setStrokeWidth(15);//加粗 便于显示
        canvas.drawPoint(0,0,mPaint);//绘制起点
        canvas.drawPoint(100,100,mPaint);//绘制控制点
        canvas.drawPoint(200,0,mPaint);//绘制终点
    }

cubicTo

使用方法与quadTo()方法相同，前4个参数分别为两个控制点，最后两个参数是终点

总结一下：xxxTo()方法的作用是从某一位置连接（除moveTo）到另一位置。

addXxx()系列

add家族成员主要有：addRect, addRoundRect, addOval, addCircle, addPath, addArc
前面几个方法小伙伴们一看就知道啥东西了。和上一期讲的内容相似，只不过是把基础图形添加到path中绘制。
以addRect为例，

public void addRect(RectF rect, Direction dir)

第二个参数是一个枚举，有Path.Direction.CW和Path.Direction.CCW两种选择，分别代表顺时针和逆时针的闭合方向（所有add封闭型path都需要这个参数）。什么叫闭合方向呢？光说大家一定会蒙，有学习激情的童鞋看到后肯定会马上敲代码试验一下两者的区别，可是不管你如何改，单独地在一条闭合曲线上你是看不出所谓闭合方向的区别的。为了弄懂它，我们在path上绘制一些文字来说明最后参数的意义：

protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.translate(getWidth()/2,getHeight()/2);

        //绘制坐标系
        float [] pts = new float[]{0,0,mWidth/2,0,0,0,0,mHeight/2};
        mPaint.setColor(Color.BLACK);
        canvas.drawLines(pts,mPaint);

        Path path = new Path();// 创建Path
        path.addRect(100,100,300,200, Path.Direction.CW);

        mPaint.setTextSize(50);
        // 绘制路径上的文字
        canvas.drawTextOnPath("abcdefghijklmn", path, 0, 0, mPaint);
    }

顺时针

逆时针

addArc()

这东西咋一看和arcTo()很像，没错，事实上也差不多。
addArc(参数一,参数二,参数三)等价于arcTo(参数一,参数二,参数三,true);

addPath()

顾名思义，把一个path添加到另一个path中:

protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.translate(getWidth()/2,getHeight()/2);

        //绘制坐标系
        float [] pts = new float[]{0,0,mWidth/2,0,0,0,0,mHeight/2};
        mPaint.setColor(Color.BLACK);
        canvas.drawLines(pts,mPaint);

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

        Path path = new Path();
        path.addRect(rectF, Path.Direction.CW);

        Path path1 = new Path();
        path1.addOval(rectF, Path.Direction.CW);

        path1.addPath(path);
//        path1.addPath(path,100,100);//后两个参数控制平移

        canvas.drawPath(path1,mPaint);
    }

结果如下：

如果添加上两个参数，则在X轴和Y轴方向上分别平移了100px：

rXXXTo()系列

rXXXTo()系列基本上是XXXTo()系列的小弟

public void rCubicTo(float x1, float y1, float x2, float y2, float x3, float y3)  
public void rLineTo(float dx, float dy)  
public void rMoveTo(float dx, float dy)  
public void rQuadTo(float dx1, float dy1, float dx2, float dy2)  

这一系列rXXXTo方法其实跟上面的那些XXXTo差不多的，唯一的不同是rXXXTo方法的参考坐标是相对的而XXXTo方法的参考坐标始终是参照画布原点坐标，什么意思呢？举个简单的例子：

protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.translate(getWidth()/2,getHeight()/2);

        //绘制坐标系
        float [] pts = new float[]{0,0,mWidth/2,0,0,0,0,mHeight/2};
        mPaint.setColor(Color.BLACK);
        canvas.drawLines(pts,mPaint);

        Path path = new Path();
        path.moveTo(100,100);
        path.lineTo(200,200);
        //path.rLineTo(200,200);

        canvas.drawPath(path,mPaint);
    }

把path.lineTo(200,200);换成path.rLineTo(200,200);结果如下：

线段长了很多，因为这里的(200,200)是相对于开始点(100,100)来说的，是相对坐标。如果换算成绝对坐标就是绘制一条(100,100)到(300,300)之间的线段。其实，这个前缀“r”也就是relative（相对）的简写！

其他几个比较重要的方法

setLastPoint()

重置当前path中最后一个点位置，会对上一次的绘制造成影响。

protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.translate(getWidth()/2,getHeight()/2);

        //绘制坐标系
        float [] pts = new float[]{0,0,mWidth/2,0,0,0,0,mHeight/2};
        mPaint.setColor(Color.BLACK);
        canvas.drawLines(pts,mPaint);

        Path path = new Path();
        path.lineTo(200,200);
        path.setLastPoint(300,200);
        canvas.drawPath(path,mPaint);
        mPaint.setStrokeWidth(15);//加粗，便于显示
        mPaint.setColor(Color.RED);
        canvas.drawPoint(200,200,mPaint);
    }

虽然我们lineTo（200，200），但是紧接着调用setLastPoint(300,200)方法，把最后一个点移动到（300，200）的位置，所以所画的直线是从原点到（300，200）的位置

offset()

对当前路径之前的操作进行偏移(不会影响之后的操作)

//将新的path赋值到现有path
public void offset (float dx, float dy)
//将新的path赋值到dst,不影响现有path，当dst为null时，效果同上一种方法
public void offset (float dx, float dy, Path dst)

参数：
dx：X轴方向上的平移
dy：Y轴方向上的平移
dst：用于储存平移后的结果

protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.translate(getWidth()/2,getHeight()/2);

        //绘制坐标系
        float [] pts = new float[]{0,0,mWidth/2,0,0,0,0,mHeight/2};
        mPaint.setColor(Color.BLACK);
        canvas.drawLines(pts,mPaint);

        Path path = new Path();                     // path中添加一个圆形(圆心在坐标原点)
        path.addCircle(0,0,100, Path.Direction.CW);

        Path dst = new Path();                      // dst中添加一个矩形
        dst.addRect(-200,-200,200,200, Path.Direction.CW);

        path.offset(300,0,dst);                     // 平移

        canvas.drawPath(path,mPaint);               // 绘制path

        mPaint.setColor(Color.BLUE);                // 更改画笔颜色

        canvas.drawPath(dst,mPaint);                // 绘制dst
    }

1500287070(1).jpg

结语

剩余的一些方法比较简单，查看上面的表就可以了