java动效_Animations开源动效分析（一）POP按钮动画

最近Github有一个上很火的开源动画集叫Animations。

我也很喜欢做动画动效，特来学习观摩。因为动效的特殊性，很多情况下这个项目里的动效不能直接Copy到我们现有的项目中直接使用，所以搞清楚她们的实现原理就很有必要了。建议配合源码学习。

POP按钮动画

效果如下

思路 整体效果是用三个CAShapeLayer和一个UILabel组合实现的。CAShapeLayer负责绘制两个圆的边和一个实心圆。动画用POP的POPBasicAnimation和POPSpringAnimation。

你的肉眼能看出哪里用得哪种动画么？实心圆的尺寸变化、和空心圆的绘制进度是POPBasicAnimation实现的，基本是一个线性动画，匀速。实心圆的颜色改变用的是POPSpringAnimation弹簧动画。

关于CAShapeLayer

CAShapeLayer是一中特殊的CALayer用于绘制图形，可以理解成是CoreGraphic的一种对象化封装。一个CAShapeLayer可以绘制一个简单图形。例如例子里的圆

UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(self.lineWidth + self.radius, self.lineWidth + self.radius)

radius:self.radius + self.lineWidth / 2.f

startAngle:self.sta