一看就懂demo下载,地址:github
想做一个简单的动画,运用一下CAAnimation,思路是:开始两个图标重叠在一起,点击按钮,两个图标分别向两边倾斜,回到原点后交换前后位置
1.要交换前后位置那肯定是要涉及到z轴了,动画实现:
CABasicAnimation *z =
[CABasicAnimation animationWithKeyPath:@"zPosition"];
z.fromValue = @(self.indicator);
z.toValue = @(-self.indicator);
z.duration = 1;
2.往两边移动,对应属性是position,动画实现:
CAKeyframeAnimation *p =
[CAKeyframeAnimation animationWithKeyPath:@"position"];
p.values = @[[NSValue valueWithCGPoint:CGPointZero],
[NSValue valueWithCGPoint:CGPointMake(90, -20)],
[NSValue valueWithCGPoint:CGPointZero]];
p.timingFunctions =
@[[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut],
[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
p.additive = YES;
p.duration = 1;
3.倾斜的话,对应transform.rotation,动画实现:
CAKeyframeAnimation *r =
[CAKeyframeAnimation animationWithKeyPath:@"transform.rotation"];
r.values = @[@0, @0.1, @0];
r.duration = 1;
r.timingFunctions =
@[[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut],
[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];