仿支付宝支付成功打勾动画（关于PathMeasure你该知道的东西）

Android路径动画

沿预定路径生成动画图像（无论是直线或曲线）是做动画时一种常见的情况。传统方法是寻找Path的函数（贝塞尔函数用的比较多），带入x的值来计算y的值， 然后使用坐标(x,y)来完成动画。
现在还有一种更简单的方法：通过使用path和PathMeasure来完成。
Path大家都很熟悉了，那PathMeasure是什么东西呢，从命名上就可以看出，这相当于Path坐标计算器。以前我们需要知道路径函数的算法才能算坐标，现在PathMeasure帮我们处理了这一过程。现在来讲讲它的使用方法

初始化

PathMeasure pathMeasure = new PathMeasure();

PathMeasure提供了一个setPath()将path和pathMeasure进行绑定

pathMeasure.setPath(path,false);

当然也可通过初始化的时候就指定：

PathMeasure pathMeasure＝ new PathMeasure(Path path,boolean forceClosed);

forceClosed决定是否强制闭合，设置为true的话，path首位最尾在measure时会闭合。

forceClosed参数对绑定的Path不会产生任何影响，例如一个折线段的Path，本身是没有闭合的，forceClosed设置为True的时候，PathMeasure计算的Path是闭合的，但Path本身绘制出来是不会闭合的。

forceClosed参数对PathMeasure的测量结果有影响，还是例如前面说的一个折线段的Path，本身没有闭合，forceClosed设置为True，PathMeasure的计算就会包含最后一段闭合的路径，与原来的Path不同。

API提供的其它重要方法

• float getLength():获取路径长度
• boolean getPosTan(float distance, float[] pos, float[] tan) 传入一个大于0小于getLength()的获取坐标点和切线的坐标，放入post[]和tan[]中
• boolean getSegment(float startD, float stopD, Path dst, boolean startWithMoveTo) 传入一个开始点和结束点， 然后会返回介于这之间的Path，当作dst。startWithMoveTo通常为True，保证每次截取的Path片段都是正常的、完整的
• boolean nextContour 当需要传入多个path的时候进行切换用的，contour时是轮廓的意思

支付动画简单版——打勾动画

PathMeasure到底是怎么做的呢，我们先以一个支付动画的简单版来说明，在这个实例中，要完成的操作就是画一个圆，在圆圈里面进行动态打勾。这里用的的是getSegment不断绘制path的每一段，直到绘制完成。
怎么控制进度呢，我们定义了一个tickPercent来标记进度的百分比，通过valueAnimator来实时更新进度来绘制，具体的实现代码如下：

public class CircleTickView extends View {    private PathMeasure tickPathMeasure;    /**     * 打钩百分比     */    float tickPercent = 0;    private Path path;    //初始化打钩路径    private Path tickPath;    // 圆圈的大小,半径    private int circleRadius;    private int circleColor;    private int circleStrokeWidth;    private RectF rec;    private Paint tickPaint;    public CircleTickView(Context context, AttributeSet attrs, int defStyleAttr) {        super(context, attrs, defStyleAttr);        init(context, attrs);    }    public CircleTickView(Context context, AttributeSet attrs) {        super(context, attrs);        init(context, attrs);    }    public CircleTickView(Context context) {        super(context);        init(context, null);    }    public void init(Context context, AttributeSet attrs) {        TypedArray mTypedArray = context.obtainStyledAttributes(attrs, R.styleable.CircleTickView);        circleRadius = mTypedArray.getInteger(R.styleable.CircleTickView_circleRadius, 150);        circleColor = mTypedArray.getColor(R.styleable.CircleTickView_circleViewColor, ContextCompat.getColor(context, R.color.colorPrimary));        circleStrokeWidth = mTypedArray.getInteger(R.styleable.CircleTickView_circleStrokeWidth, 20);        mTypedArray.recycle();        tickPaint = new Paint();        tickPathMeasure = new PathMeasure();        rec = new RectF();        path = new Path();        tickPath = new Path();        tickPaint.setStyle(Paint.Style.STROKE);        tickPaint.setAntiAlias(true);        tickPaint.setColor(circleColor);        tickPaint.setStrokeWidth(circleStrokeWidth);        //打钩动画        ValueAnimator mTickAnimation;        mTickAnimation = ValueAnimator.ofFloat(0f, 1f);        mTickAnimation.setStartDelay(1000);        mTickAnimation.setDuration(500);        mTickAnimation.setInterpolator(new AccelerateInterpolator());        mTickAnimation.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {            @Override            public void onAnimationUpdate(ValueAnimator animation) {                tickPercent = (float) animation.getAnimatedValue();                invalidate();            }        });        mTickAnimation.start();    }    @Override    protected void onDraw(Canvas canvas) {        int width = canvas.getWidth();        int height = canvas.getHeight();        // 根据设置该view的高度，进行对所画图进行居中处理        int offsetHeight = (height - circleRadius * 2) / 2;        // 设置第一条直线的相关参数        int firStartX = width / 2 - circleRadius * 3 / 5;        int firStartY = offsetHeight + circleRadius;        int firEndX = (width / 2 - circleRadius / 5) - 1;        int firEndY = offsetHeight + circleRadius + circleRadius / 2 + 1;        int secEndX = width / 2 + circleRadius * 3 / 5;        int secEndY = offsetHeight + circleRadius / 2;        rec.set(width / 2 - circleRadius, offsetHeight, width / 2 + circleRadius, offsetHeight + circleRadius * 2);        tickPath.moveTo(firStartX, firStartY);        tickPath.lineTo(firEndX, firEndY);        tickPath.lineTo(secEndX, secEndY);        tickPathMeasure.setPath(tickPath, false);        /*         * On KITKAT and earlier releases, the resulting path may not display on a hardware-accelerated Canvas.         * A simple workaround is to add a single operation to this path, such as dst.rLineTo(0, 0).         */        tickPathMeasure.getSegment(0, tickPercent * tickPathMeasure.getLength(), path, true);        path.rLineTo(0, 0);        canvas.drawPath(path, tickPaint);        canvas.drawArc(rec, 0, 360, false, tickPaint);    }}

想写这么多了，有空再把全真的支付宝支付动画po上来。