GitHub传送门 mars 选择城市动画
分析动画组成
- 3D旋转
- CATransform3DRotate
CATransform3D transform = CATransform3DIdentity;
//m34 http://www.cnblogs.com/OIMM/p/5205528.html
//m43 z轴平移 由于两个view做m34动画的时候会出现重叠 调整两个视图的z轴距离避免重叠
transform.m34 = -1.0/ 500;
if (isPush) {
transform.m43 = isLeft ? 1000:0;
} else {
transform.m43 = isLeft ? 0:1000;
}
//CATransform3D 帧动画
CAKeyframeAnimation *anim_3d = [CAKeyframeAnimation animationWithKeyPath:@"transform"];
CATransform3D begin = CATransform3DRotate(transform, radianFromDegree(0), 0, 1, 0);
CATransform3D middle = CATransform3DRotate(transform, radianFromDegree(isLeft ? 25:-25), 0, 1, 0);
middle.m43 = 0;
CATransform3D end = CATransform3DRotate(transform, radianFromDegree(isLeft ? 10:0), 0, 1, 0);
if (isPush) {
end.m43 = isLeft ? -1000:0;
} else {
end.m43 = isLeft ? 0:-1000;
}
anim_3d.values = @[[NSValue valueWithCATransform3D: begin],[NSValue valueWithCATransform3D:middle] ,[NSValue valueWithCATransform3D:end]];
- 水平移动
- transform.translation.x
- 缩小
- transform.scale
动画实现
- 利用iOS 核心动画 帧动画
动画效果
- 发现效果不如mars的完美 就当是学习一下
<img src="http://upload-images.jianshu.io/upload_images/1899979-ff58980be24e69d9.gif?imageMogr2/auto-orient/strip" width="375">