贝塞尔曲线及Path类详解（1）

贝塞尔曲线

贝塞尔曲线是计算机图形图像造型的基本工具，是图形造型运用得最多的基本线条之一。它通过控制曲线上的四个点（起始点、终止点以及两个相互分离的中间点）来创造、编辑图形。其中起重要作用的是位于曲线中央的控制线。这条线是虚拟的，中间与贝塞尔曲线交叉，两端是控制端点。移动两端的端点时贝塞尔曲线改变曲线的曲率（弯曲的程度）；移动中间点（也就是移动虚拟的控制线）时，贝塞尔曲线在起始点和终止点锁定的情况下做均匀移动。

注意，贝塞尔曲线上的所有控制点、节点均可编辑。这种“智能化”的矢量线条为艺术家提供了一种理想的图形编辑与创造的工具。
Android中的Path类中提供了若干方法绘制想要的图形。

public class MyView extends View {
    private Paint paint;
    private Path path;


    public MyView(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        paint = new Paint();
        paint.setStyle(Paint.Style.STROKE);
        paint.setColor(Color.BLUE);
        paint.setStrokeWidth(10);
        path = new Path();
        drawLine();
    }

    /**
     * 1.默认从屏幕原点(0,0)开始绘制
     */
    private void drawLine() {
        path.lineTo(300, 300);
        move();
    }

    /**
     * 2.move方法主要用于移动画笔
     */
    private void move() {
        path.moveTo(500, 300);
        path.lineTo(800, 300);
        quadTo();
    }

    /**
     * 3.path方法中quadTo()方法提供了两点间的贝塞尔曲线
     * (x1,y1) 为控制点，(x2,y2)为结束点。
     */
    private void quadTo() {
        path.quadTo(500, 400, 200, 800);
        cubicTo();

    }

    /**
     * 4.cubicTo 同样是用来实现贝塞尔曲线的。
     * cubicTo(float x1, float y1, float x2, float y2,float x3, float y3)
     * 相较于quadTo()多了一个控制点
     * 如果第一个起始点就和控制点一样,则相当于使用quaTo方法
     */
    private void cubicTo() {
        path.moveTo(100, 800);
        path.cubicTo(100, 800, 300, 400, 600, 800);
        cubicTo2();
    }

    /**
     * 使用两个控制点绘制贝塞尔曲线
     */
    private void cubicTo2() {
        path.moveTo(0, 0);
        path.cubicTo(100, 800, 300, 400, 600, 800);
        drawArcTo();
    }

    /**
     * arcTo 用于绘制圆形或者椭圆,绘制好矩形后,选取需要到的角度
     */
    private void drawArcTo() {
        RectF rectF = new RectF(10, 10, 600, 600);
        path.arcTo(rectF, 0, 90);
        invalidate();
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.drawPath(path, paint);
    }
}

绘制drawArcTo

为了方便把矩形区域也截取出来了，绘制的弧线是矩形区域的中心点的角度。

贝塞尔曲线两个控制点的曲线

贝塞尔曲线一个控制点的曲线

使用lineTo和moveTo方法移动画笔