iOS --- 一张图看懂转场动画

转场动画在iOS开发中非常常见, 其原理大概如下图:

一切都是从图中的 * Transition Animation * 开始.

本文主要基于以上这张图, 讲解了transitionFromViewController, CATransition, TransitionAnimation三种转场实现方式.

transitionFromViewController

我们可以先看UIViewController自带的方法:
transitionFromViewController:toViewController:duration:options:animations:completion:
参数很多, 不过都非常直观.
通常的使用场景是 在多个Child ViewController之间切换.

AViewController *a = self.childViewControllers[0];
BViewController *b = self.childViewControllers[1];
CViewController *c = self.childViewControllers[2];

// Curl 翻页效果
// UIViewAnimationOptionTransitionCurlUp, UIViewAnimationOptionTransitionCurlDown
// Flip 翻转效果
// UIViewAnimationOptionTransitionFlipFromLeft, UIViewAnimationOptionTransitionFlipFromRight
// UIViewAnimationOptionTransitionFlipFromTop, UIViewAnimationOptionTransitionFlipFromDown

[self transitionFromViewController:_currentViewController
                  toViewController:b
                          duration:0.5
                           options:UIViewAnimationOptionTransitionFlipFromRight
                        animations:^{

} completion:^(BOOL finished) {

}];

转场的效果可以通过options和animations参数来控制.

NewsNavigationBar

这个demo是利用transitionFromViewController方法实现的类似网易新闻的导航栏样式.
DemoNewsNavigationBar

CATransition

CATransition继承自CALayer, 包含了一些场景的动画效果. 如Fade，Cube，Ripple，PageCurl，CameraIrilHollow等.
使用如下:

CATransition *animation = [CATransition animation];
animation.duration = 0.5;
animation.timingFunction = UIViewAnimationOptionCurveEaseInOut;
animation.type = kCATransitionFade;

// 在当前view上执行CATransition动画
// [self.view.layer addAnimation