PathMeasure相关知识及运用

PathMeasure详解文章：
[eclipse_xu]：http://www.jianshu.com/p/3efa5341abcc
[GcsSloop]自定义View魔法系列：http://www.gcssloop.com/customview/Path_PathMeasure/
[扔物线]开发进阶系列：https://zhuanlan.zhihu.com/p/27787919

运用demo来自[Anonymous___]：http://www.jianshu.com/p/4bb16cefca23

实践+注解

import android.animation.Animator;
import android.animation.ValueAnimator;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Matrix;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.PathMeasure;
import android.graphics.RectF;
import android.os.Handler;
import android.os.Message;
import android.support.annotation.Nullable;
import android.util.AttributeSet;
import android.util.Log;
import android.view.View;

import com.mps.hencoder.R;

/**
 * 路径绘制： 主要使用PathMeasure类
 * Created by F011512088 on 2017/12/4.
 */

public class GranzortView extends View {

    private final String TAG = GranzortView.class.getSimpleName();

    private Paint paint;

    private float strokeWidth = 10;
    private float differ = 20;
    private float maxRadius;

    private float mViewWidth;
    private float mViewHeight;

    private Path innerCircle;//内圆 path
    private Path outerCircle;//外圆 path
    private Path trangle1;//第一个三角形的 Path
    private Path trangle2;//第二个三角形的 Path
    private Path drawPath;//用于截取路径的 Path,用于保存PathMeasure路径
    private float distance = 0;//当前动画执行的百分比取值为0-1

    private int duration = 3000;
    private ValueAnimator valueAnimator;
    private ValueAnimator.AnimatorUpdateListener animatorUpdateListener;
    private ValueAnimator.AnimatorListener animatorListener;

    private PathMeasure pathMeasure;

    private State mCurrentState = State.CIRCLE_STATE;
    private Handler mHanlder;

    //三个阶段的枚举
    private enum State {
        CIRCLE_STATE,
        TRANGLE_STATE,
        FINISH_STATE
    }

    public GranzortView(Context context) {
        super(context);
        init();
    }

    public GranzortView(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        init();
    }

    public GranzortView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();
    }

    private void init() {

        initPaint();

        initPath();

        initAnimatorListener();

        initAnimator();

        initHandler();

        mCurrentState = State.CIRCLE_STATE;
        valueAnimator.start();
    }

    private void initPath() {
        innerCircle = new Path();
        outerCircle = new Path();

        trangle1 = new Path();
        trangle2 = new Path();

        drawPath = new Path();

        pathMeasure = new PathMeasure();

    }

    private void initPaint() {
        paint = new Paint(Paint.ANTI_ALIAS_FLAG);
        paint.setColor(Color.WHITE);
        paint.setStyle(Paint.Style.STROKE);
        paint.setStrokeWidth(strokeWidth);
        paint.setStrokeCap(Paint.Cap.ROUND);
        paint.setStrokeJoin(Paint.Join.BEVEL);
        paint.setShadowLayer(15, 0, 0, Color.WHITE);//白色光影效果
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        mViewWidth = getMeasuredWidth();
        mViewHeight = getMeasuredHeight();
        setViewPaint();
    }

    private void setViewPaint() {
        float minLength = Math.min(mViewWidth / 2, mViewHeight / 2);
        maxRadius = (minLength - strokeWidth);
        //画布原点转为中心点
        RectF innerRect = new RectF(-maxRadius + differ, -maxRadius + differ, maxRadius - differ, maxRadius - differ);
        RectF outerRect = new RectF(-maxRadius, -maxRadius, maxRadius, maxRadius);
        innerCircle.addArc(innerRect, 150, -359.9F);     // 不能取360f，否则可能造成测量到的值不准确
        outerCircle.addArc(outerRect, 60, -359.9F);

        pathMeasure.setPath(innerCircle, false);
        /**
         * boolean getPosTan (float distance, float[] pos, float[] tan)
         * 用于获取路径上某点的坐标及其切线的坐标
         * 描述： 通过指定distance（0<distance<getLength），来获取坐标点和切线的坐标，并保存到pos[]和tan[]数组中
         */
        float[] pos = new float[2];
        pathMeasure.getPosTan(0, pos, null);        // 获取开始位置的坐标
        trangle1.moveTo(pos[0], pos[1]);
        pathMeasure.getPosTan((1f / 3f) * pathMeasure.getLength(), pos, null);
        Log.e(TAG, "pos : " + pos[0] + "  " + pos[1]);

        trangle1.lineTo(pos[0], pos[1]);
        pathMeasure.getPosTan((2f / 3f) * pathMeasure.getLength(), pos, null);
        trangle1.lineTo(pos[0], pos[1]);
        trangle1.close();

        pathMeasure.getPosTan((2f / 3f) * pathMeasure.getLength(), pos, null);
        Matrix matrix = new Matrix();
        matrix.postRotate(-180);
        trangle1.transform(matrix, trangle2);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.drawColor(getResources().getColor(R.color.colorPrimary));
        canvas.save();
        canvas.translate(mViewWidth / 2, mViewHeight / 2);

        switch (mCurrentState) {
            case CIRCLE_STATE:
                drawCircle(canvas);
                break;
            case TRANGLE_STATE:
                drawLine(canvas);
                break;
            case FINISH_STATE:
                drawDistanceLine(canvas);
                break;
        }
    }

    private void drawDistanceLine(Canvas canvas) {
        canvas.drawPath(innerCircle, paint);
        canvas.drawPath(outerCircle, paint);
        drawPath.reset();
        pathMeasure.setPath(trangle1, false);
        pathMeasure.getSegment(0, distance * pathMeasure.getLength(), drawPath, true);
        canvas.drawPath(drawPath, paint);
        drawPath.reset();
        pathMeasure.setPath(trangle2, false);
        pathMeasure.getSegment(0, distance * pathMeasure.getLength(), drawPath, true);
        canvas.drawPath(drawPath, paint);
    }

    private void drawLine(Canvas canvas) {
        canvas.drawPath(innerCircle, paint);
        canvas.drawPath(outerCircle, paint);
        drawPath.reset();
        pathMeasure.setPath(trangle1, false);
        float stopD = distance * pathMeasure.getLength();
        float startD = stopD - (0.5f - Math.abs(0.5f - distance)) * 200;
        pathMeasure.getSegment(startD, stopD, drawPath, true);
        canvas.drawPath(drawPath, paint);
        drawPath.reset();
        pathMeasure.setPath(trangle2, false);
        pathMeasure.getSegment(startD, stopD, drawPath, true);
        canvas.drawPath(drawPath, paint);
    }

    private void drawCircle(Canvas canvas) {
        //情况路径,只记录最后状态
        drawPath.reset();
        pathMeasure.setPath(innerCircle, false);
        /**
         * boolean getSegment (float startD, float stopD, Path dst, boolean startWithMoveTo)
         * 这个API用于截取整个Path的片段，通过参数startD和stopD来控制截取的长度，
         * 并将截取的Path保存到dst中，最后一个参数startWithMoveTo表示起始点是否使用moveTo方法，
         * 通常为True，保证每次截取的Path片段都是正常的、完整的
         *备注：
         * 由于硬件加速的问题，PathMeasure中的getSegment在讲Path添加到dst数组中时会被导致一些错误，需要通过mDst.lineTo(0,0)来避免这样一个Bug
         */
        pathMeasure.getSegment(0, distance * pathMeasure.getLength(), drawPath, true);
        canvas.drawPath(drawPath, paint);
        pathMeasure.setPath(outerCircle, false);
        drawPath.reset();
        pathMeasure.getSegment(0, distance * pathMeasure.getLength(), drawPath, true);
        canvas.drawPath(drawPath, paint);

    }

    private void initAnimatorListener() {
        animatorUpdateListener = new ValueAnimator.AnimatorUpdateListener() {
            @Override
            public void onAnimationUpdate(ValueAnimator animation) {
                distance = (float) animation.getAnimatedValue();
                invalidate();
            }
        };

        animatorListener = new Animator.AnimatorListener() {
            @Override
            public void onAnimationStart(Animator animation) {
                Log.e("star:", mCurrentState + "_");
            }

            @Override
            public void onAnimationEnd(Animator animation) {
                Log.e("end:", mCurrentState + "_");
                mHanlder.sendEmptyMessage(0);
            }

            @Override
            public void onAnimationCancel(Animator animation) {

            }

            @Override
            public void onAnimationRepeat(Animator animation) {

            }
        };
    }

    private void initAnimator() {
        valueAnimator = ValueAnimator.ofFloat(0, 1).setDuration(duration);

        valueAnimator.addUpdateListener(animatorUpdateListener);

        valueAnimator.addListener(animatorListener);
    }

    private void initHandler() {
        mHanlder = new Handler() {
            @Override
            public void handleMessage(Message msg) {
                switch (mCurrentState) {
                    case CIRCLE_STATE:
                        mCurrentState = State.TRANGLE_STATE;
                        valueAnimator.start();
                        break;
                    case TRANGLE_STATE:
                        mCurrentState = State.FINISH_STATE;
                        valueAnimator.start();
                        break;
                }
            }
        };
    }

    /**
     * 消费完成，取消监听
     */
    @Override
    protected void onDetachedFromWindow() {
        valueAnimator.removeAllListeners();
        valueAnimator.cancel();
        mHanlder = null;
        super.onDetachedFromWindow();
    }
}
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
  • 人面猴
    序言：七十年代末，一起剥皮案震惊了整个滨河市，随后出现的几起案子，更是在滨河造成了极大的恐慌，老刑警刘岩，带你破解...
    沈念sama阅读 203,937评论 6赞 478
  • 死咒
    序言：滨河连续发生了三起死亡事件，死亡现场离奇诡异，居然都是意外死亡，警方通过查阅死者的电脑和手机，发现死者居然都...
    沈念sama阅读 85,503评论 2赞 381
  • 救了他两次的神仙让他今天三更去死
    文/潘晓璐 我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
    开封第一讲书人阅读 150,712评论 0赞 337
  • 道士缉凶录：失踪的卖姜人
    文/不坏的土叔 我叫张陵，是天一观的道长。 经常有香客问我，道长，这世上最难降的妖魔是什么？ 我笑而不...
    开封第一讲书人阅读 54,668评论 1赞 276
  • 港岛之恋（遗憾婚礼）
    正文 为了忘掉前任，我火速办了婚礼，结果婚礼上，老公的妹妹穿的比我还像新娘。我一直安慰自己，他们只是感情好，可当我...
    茶点故事阅读 63,677评论 5赞 366
  • 恶毒庶女顶嫁案：这布局不是一般人想出来的
    文/花漫 我一把揭开白布。 她就那样静静地躺着，像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上，一...
    开封第一讲书人阅读 48,601评论 1赞 281
  • 城市分裂传说
    那天，我揣着相机与录音，去河边找鬼。 笑死，一个胖子当着我的面吹牛，可吹牛的内容都是我干的。 我是一名探鬼主播，决...
    沈念sama阅读 37,975评论 3赞 396
  • 双鸳鸯连环套：你想象不到人心有多黑
    文/苍兰香墨 我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
    开封第一讲书人阅读 36,637评论 0赞 258
  • 万荣杀人案实录
    序言：老挝万荣一对情侣失踪，失踪者是张志新（化名）和其女友刘颖，没想到半个月后，有当地人在树林里发现了一具尸体，经...
    沈念sama阅读 40,881评论 1赞 298
  • 护林员之死
    正文 独居荒郊野岭守林人离奇死亡，尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,621评论 2赞 321
  • 白月光启示录
    正文 我和宋清朗相恋三年，在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,710评论 1赞 329
  • 活死人
    序言：一个原本活蹦乱跳的男人离奇死亡，死状恐怖，灵堂内的尸体忽然破棺而出，到底是诈尸还是另有隐情，我是刑警宁泽，带...
    沈念sama阅读 33,387评论 4赞 319
  • 日本核电站爆炸内幕
    正文 年R本政府宣布，位于F岛的核电站，受9级特大地震影响，放射性物质发生泄漏。R本人自食恶果不足惜，却给世界环境...
    茶点故事阅读 38,971评论 3赞 307
  • 男人毒药：我在死后第九天来索命
    文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹，春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,947评论 0赞 19
  • 一桩弑父案，背后竟有这般阴谋
    文/苍兰香墨 我抬头看了看天上的太阳。三九已至，却和暖如春，着一层夹袄步出监牢的瞬间，已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,189评论 1赞 260
  • 情欲美人皮
    我被黑心中介骗来泰国打工， 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留，地道东北人。 一个月前我还...
    沈念sama阅读 44,805评论 2赞 349
  • 代替公主和亲
    正文 我出身青楼，却偏偏与公主长得像，于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子，可洞房花烛夜当晚...
    茶点故事阅读 42,449评论 2赞 342

推荐阅读更多精彩内容

  • Android - 收藏集
    Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 171,413评论 25赞 707
  • 双十一，回家
    今天 双十一 周六 和爱人一起回家 天冷了 给婆婆妈带了一床太空被 套好了被罩 老妈说 我和你爹盖的就是你夏天拿回...
    WXJ水晶物语阅读 435评论 0赞 1
  • 市场型设计工作的思考
    审美是具有个体差异性的。由于不同的人在不同的环境下形成的不同的审美观，会直接导致审美差异的存在。用正确的态度面对差...
    Teresa203阅读 176评论 0赞 0
  • SPS & PPS in H.264 详解
    Parameter Sets A parameter set is supposed to contain inf...
    FlyingPenguin阅读 4,899评论 0赞 2