Android自定义View(十一)_Path之玩出花样(PathMeasure)

Path之玩出花样(PathMeasure)

可以看到，在经过 Android自定义View(十)_Path之完结篇(伪) 后， Path中各类方法基本上都讲完了，表格中还没有讲解到到方法就是矩阵变换了，难道本篇终于要讲矩阵了？
非也，矩阵这一部分仍在后面单独讲解，本篇主要讲解 PathMeasure 这个类与 Path 的一些使用技巧。

| 准备搜索 | 放大镜图标逐渐变化为一个点 |
| 正在搜索 | 围绕这一个圆环运动，并且线段长度会周期性变化 |
| 准备结束 | 从一个点逐渐变化成为放大镜图标 |

这些状态是有序转换的，转换流程以及转换条件如下：

其中 正在搜索 这个状态持续时间长度是不确定的，在没有搜索完成前，应该一直处于搜索状态。

简单的分析了其大致的流程之后，就到了制作的重点:对细节对把握。

Path 划分

为了制作对方便，此处整个动效用了两个 Path， 一个是中间对放大镜， 另一个则是外侧的圆环,将两者全部画出来是这样子的。

其中 Path 的走向要把握好，如下(只是一个放大镜，并不是♂):

其中圆形上面的点可以用 PathMeasure 测量，无需计算。

动画状态与时间关联

此处使用的是 ValueAnimator，它可以将一段时间映射到一段数值上，随着时间变化不断的更新数值，并且可以使用插值器开控制数值变化规律(此处使用的是默认插值器)。

PS: 本来不想提前暴露这个的，准备偷偷留到动画部分(｡-_-｡) 但实在是没有优雅的替代方案了。

具体绘制

绘制部分是根据 当前状态以及从 ValueAnimator 获得的数值来截取 Path 中合适的部分绘制出来。

最终效果

源码

上面的内容是为了帮助大家从把控全局流程以及理解某些细节的设计思路，而更多的内容都藏在代码中，代码总体也不算长，感兴趣的可以自己敲一遍。

戳这里查看源码

PS: 本代码仅作为示例使用，还有诸多不足，如 自定义属性，视图大小， 点击事件， 监听回调 等，并不适合直接使用，有需要的可以自行补足相关内容。

总结

本文中虽然后面的内容看起来比较高大上一点，但前面”啰嗦”的废话才是真正的干货，把前面的东西学会了，后面的各种效果都能信手拈来，如果只研究后面的东西，则是取其形，而难以会其意。

参考资料

PathMeasure

AndroidSVG

android-pathview

android Path 和 PathMeasure 进阶

Path之玩出花样(PathMeasure)