tip:仅仅是CAShapeLayer,CAGradientLayer的简单使用案例
先上效果图:
就是这个小东西.gif
原理:
实现中用到的两个Layer,一个CAGradientLayer用来生成渐变色,两个CAShapeLayer,一个用来划线,另一个用来做CAGradientLayer的mask用于显示出所划线下面的渐变区域。动画,直接通过timer,循环递增点来实现。
具体实现:
设置layer:
添加layer.png
这个没啥可说的,给View的layer添加一个GradientLayer和一个LineLayer,给GradientLayer添加一个mask
画线:
画线.png
(1)currentIndex是当前已经画到的点,当画到currentIndex时,刚好得到第一个点到currentIndex点的线路径,这时给lineLayer赋值Path,
(2)继续从currentIndex点依次连接currentIndex和第一个点对应的X轴点,然后回到第一个点。此时Path是一个封闭的图形,这时给MaskLayer赋值。
整个路径就算画完了,继续进行下一个点。循环就生成动画。
然后就写完了,太简单了。可能是还有好多事没做。比如,一个图怎么能没有X、Y坐标的值