仿网易云音乐广告页的转场动画

先上效果图：

具体代码：
toVC.view.layer.transform = CATransform3DMakeRotation(M_PI_2, 0.0, 1.0, 0.0);

0 ～ t ／ 2 阶段

fromVC 顺时针从 0 度转到 - pi / 2 的位置，toVC 在 pi / 2 位置保持不动。(这时在视觉上二者重合)

t / 2 ～ t 阶段

toVC 从初始的 pi / 2 位置顺时针转到 0 位置。

0 ～ pi 阶段的具体代码：

[UIView animateKeyframesWithDuration:duration delay:0.0 options:0 animations:^{
        [UIView addKeyframeWithRelativeStartTime:0.0
                                relativeDuration:0.5
                                      animations:^{
                                          fromVC.view.layer.transform = CATransform3DMakeRotation(- M_PI_2, 0.0, 1.0, 0.0);
                                    }];
        [UIView addKeyframeWithRelativeStartTime:0.5
                                relativeDuration:0.5
                                      animations:^{
                                          toVC.view.layer.transform =  CATransform3DMakeRotation(0.0, 0.0, 1.0, 0.0);
                                    }];
                              } completion:^(BOOL finished) {
                                  [transitionContext completeTransition:![transitionContext transitionWasCancelled]];
    }];

值得提一下 [transitionContext completeTransition:![transitionContext transitionWasCancelled]]; ，如果没有取消动画的话，即为 [transitionContext completeTransition: YES]。在该方法中，* UIKit will ensure the final state is consistent and remove the fromView from the container. * ，即，在我们这里，该方法将会移除 fromVC.view 。

结尾

该动画源码已上传 GitHub，链接戳此。有问题可以提 issue 或者直接在本博文下方的评论框中进行评论。

其实该动画并不难，建议对着源码多比较，并按 option + 函数名 查看官方定义，会很有收获的。

参考链接也不另给了，基本都是 Apple 官方的文档，没有什么资料比官方文档更有说服力了。

联系我

• 微博：@CaiYue_
• 简书：蔡越
• 邮箱：yuecai.nju@gmail.com