iOS7.0后蘋果提供了自定義轉(zhuǎn)場動畫的API溢吻，利用這些API我們可以改變 push和pop（navigation非模態(tài)），present和dismiss（模態(tài)），標(biāo)簽切換（tabbar）的默認(rèn)轉(zhuǎn)場動畫趟佃。
主要涉及的API
1耸袜、UIViewControllerAnimatedTransitioning：轉(zhuǎn)場動畫協(xié)議友多，實現(xiàn)此協(xié)議定義轉(zhuǎn)場的動畫行為。
// 定義轉(zhuǎn)場動畫的時間
- (NSTimeInterval)transitionDuration:(nullable id <UIViewControllerContextTransitioning>)transitionContext;
// 定義轉(zhuǎn)場動畫的行為
- (void)animateTransition:(id <UIViewControllerContextTransitioning>)transitionContext;
2堤框、 UIViewControllerContextTransitioning：轉(zhuǎn)場動畫上下文域滥，這個協(xié)議定義了轉(zhuǎn)場動畫具體參數(shù)，控制轉(zhuǎn)場動畫的狀態(tài)蜈抓，這個協(xié)議一般由系統(tǒng)實現(xiàn)启绰，在轉(zhuǎn)場發(fā)生時提供給我們使用。
From和To：轉(zhuǎn)場是兩個視圖控制器（ViewController）的行為沟使，由一個視圖控制器切換到另一個視圖控制器委可，原先呈現(xiàn)的視圖控制器叫FromViewController，將要呈現(xiàn)的視圖控制器叫ToViewController腊嗡，那么FromViewController的view叫做FromView撤缴，ToViewController的view叫做ToView。
對應(yīng)push和pop來說是兩個不同的轉(zhuǎn)場叽唱，它們的From和To在兩個轉(zhuǎn)場中使相互調(diào)換的屈呕。
containerView:轉(zhuǎn)場動畫完成都是在containerView里面镶摘。
3嗽桩、UIViewControllerInteractiveTransitioning：轉(zhuǎn)場的交互協(xié)議，用來控制轉(zhuǎn)場動畫的狀態(tài)或進(jìn)度凄敢。
//設(shè)置轉(zhuǎn)場進(jìn)度, 取值范圍 [0..1]
- (void)updateInteractiveTransition:(CGFloat)percentComplete;
//完成轉(zhuǎn)場碌冶，呈現(xiàn)to
- (void)finishInteractiveTransition;
//取消轉(zhuǎn)場，呈現(xiàn)from
- (void)cancelInteractiveTransition;
4涝缝、UIPercentDrivenInteractiveTransition：官方提供的實現(xiàn)UIViewControllerInteractiveTransitioning協(xié)議的類扑庞，可以直接使用譬重。
上面簡單的介紹了轉(zhuǎn)場動畫涉及的API，這一節(jié)主要通過導(dǎo)航控制器的push和pop轉(zhuǎn)場動畫來介紹這些自定義轉(zhuǎn)場動畫的流程罐氨。
push轉(zhuǎn)場動畫
1臀规、準(zhǔn)備工作：
帶有導(dǎo)航控制器的ViewController類，要push到的下一級控制器SecondViewController類栅隐。
2塔嬉、在類HSPushAnimation中實現(xiàn)UIViewControllerAnimatedTransitioning協(xié)議，定義push轉(zhuǎn)場動畫行為租悄。
@interface HSPushAnimation : NSObject <UIViewControllerAnimatedTransitioning>
@end
@implementation HSPushAnimation
//設(shè)置轉(zhuǎn)場動畫的時長
- (NSTimeInterval)transitionDuration:(id <UIViewControllerContextTransitioning>)transitionContext{
return 2.f;
}
- (void)animateTransition:(id <UIViewControllerContextTransitioning>)transitionContext{
//from
UIViewController *toViewController = [transitionContext viewControllerForKey:UITransitionContextToViewControllerKey];
//to
UIViewController *fromViewController = [transitionContext viewControllerForKey:UITransitionContextFromViewControllerKey];
UIView* toView = nil;
UIView* fromView = nil;
//UITransitionContextFromViewKey和UITransitionContextToViewKey定義在iOS8.0以后的SDK中谨究，所以在iOS8.0以下SDK中將toViewController和fromViewController的view設(shè)置給toView和fromView
//iOS8.0 之前和之后view的層次結(jié)構(gòu)發(fā)生變化，所以iOS8.0以后UITransitionContextFromViewKey獲得view并不是fromViewController的view
if ([transitionContext respondsToSelector:@selector(viewForKey:)]) {
fromView = [transitionContext viewForKey:UITransitionContextFromViewKey];
toView = [transitionContext viewForKey:UITransitionContextToViewKey];
} else {
fromView = fromViewController.view;
toView = toViewController.view;
}
//這個非常重要泣棋，將toView加入到containerView中
[[transitionContext containerView] addSubview:toView];
CGFloat width = [UIScreen mainScreen].bounds.size.width;
CGFloat height = [UIScreen mainScreen].bounds.size.height;
toView.frame = CGRectMake(width, 0, width, height);
[UIView animateWithDuration:[self transitionDuration:transitionContext] animations:^{
toView.frame = CGRectMake(0, 0, width, height);
} completion:^(BOOL finished) {
[transitionContext completeTransition:YES];
}];
}
@end
上面代碼定義了一個非常簡單的動畫记盒，toView從左到右覆蓋fromView，和系統(tǒng)默認(rèn)動畫一樣外傅，只是時間設(shè)置的比較長纪吮。
轉(zhuǎn)場動畫所有要呈現(xiàn)的元素都要放在containerView中，fromView默認(rèn)已經(jīng)在containerView中了萎胰。
3碾盟、指定push要使用的轉(zhuǎn)場動畫行為：由于要自定義轉(zhuǎn)場動畫所以我們需要指定轉(zhuǎn)場動畫行為。push轉(zhuǎn)場的動畫行為是由UINavigationControllerDelegate協(xié)議指定技竟，所以我們在ViewController設(shè)置導(dǎo)航控制器的Delegate：
- (void)viewDidAppear:(BOOL)animated{
[super viewDidAppear:animated];
self.navigationController.delegate = self;
}
實現(xiàn)以下協(xié)議冰肴，指定動畫類：
- (id<UIViewControllerAnimatedTransitioning>)navigationController:(UINavigationController *)navigationController animationControllerForOperation:(UINavigationControllerOperation)operation fromViewController:(UIViewController *)fromVC toViewController:(UIViewController *)toVC{
if (operation == UINavigationControllerOperationPush) {
return [[HSPushAnimation alloc] init];
}
return nil;
}
這個方法可以分別指定push和pop的動畫類，這里我們只定義push動畫榔组，所以只要指定UINavigationControllerOperationPush時的動畫行為即可熙尉。
這樣push轉(zhuǎn)場動畫就完成了，效果圖如下：
pop轉(zhuǎn)場動畫
1搓扯、pop轉(zhuǎn)場動畫和push轉(zhuǎn)場動畫類似检痰，在類HSPopAnimation中實現(xiàn)UIViewControllerAnimatedTransitioning協(xié)議。
@implementation HSPopAnimation
- (NSTimeInterval)transitionDuration:(id <UIViewControllerContextTransitioning>)transitionContext{
return 0.5;
}
- (void)animateTransition:(id <UIViewControllerContextTransitioning>)transitionContext{
UIViewController *toViewController = [transitionContext viewControllerForKey:UITransitionContextToViewControllerKey];
UIViewController *fromViewController = [transitionContext viewControllerForKey:UITransitionContextFromViewControllerKey];
UIView* toView = nil;
UIView* fromView = nil;
if ([transitionContext respondsToSelector:@selector(viewForKey:)]) {
fromView = [transitionContext viewForKey:UITransitionContextFromViewKey];
toView = [transitionContext viewForKey:UITransitionContextToViewKey];
} else {
fromView = fromViewController.view;
toView = toViewController.view;
}
//將toView加到fromView的下面锨推，非常重要Ｇ摺！换可！
[[transitionContext containerView] insertSubview:toView belowSubview:fromView];
CGFloat width = [UIScreen mainScreen].bounds.size.width;
CGFloat height = [UIScreen mainScreen].bounds.size.height;
fromView.frame = CGRectMake(0, 0, width, height);
[UIView animateWithDuration:[self transitionDuration:transitionContext] animations:^{
fromView.frame = CGRectMake(width, 0, width, height);
} completion:^(BOOL finished) {
[transitionContext completeTransition:!transitionContext.transitionWasCancelled];
}];
}
@end
這里pop動畫基本和push動畫是相反的過程椎椰，當(dāng)然你也可以指定別的方式的動畫。
這里from沾鳄、to和push動畫里面的from慨飘、to值已經(jīng)互換了，所以如果將push和pop動畫寫在一起的話译荞，要特別注意瓤的，不過建議將push和pop動畫分別定義到不同的類中休弃，方便管理。
2堤瘤、在SecondViewControlle類中設(shè)置導(dǎo)航控制器的Delegate玫芦，并實現(xiàn)以下協(xié)議：
- (id<UIViewControllerAnimatedTransitioning>)navigationController:(UINavigationController *)navigationController animationControllerForOperation:(UINavigationControllerOperation)operation fromViewController:(UIViewController *)fromVC toViewController:(UIViewController *)toVC{
if (operation == UINavigationControllerOperationPop) {
return [[HSPopAnimation alloc] init];
}
return nil;
}
pop轉(zhuǎn)場動畫就完成了浆熔，效果圖如下：
可交互轉(zhuǎn)場動畫
先來看看可交互轉(zhuǎn)場動畫效果
可交互轉(zhuǎn)場動畫的實現(xiàn)需要實現(xiàn)UIViewControllerInteractiveTransitioning協(xié)議本辐，幸好官方給我們提供了UIPercentDrivenInteractiveTransition類可以直接使用，你也可以繼承UIPercentDrivenInteractiveTransition來使用医增。
UIViewControllerInteractiveTransitioning協(xié)議的功能主要是控制轉(zhuǎn)場動畫的狀態(tài)慎皱，即動畫完成的百分比，所以只有在轉(zhuǎn)場中才有用叶骨。
比如我們通過[self.navigationController popViewControllerAnimated:YES]觸發(fā)pop轉(zhuǎn)場動畫茫多，然后在轉(zhuǎn)場動畫結(jié)束之前通過- (void)updateInteractiveTransition:(CGFloat)percentComplete更改轉(zhuǎn)場動畫的完成的百分比，那么轉(zhuǎn)場動畫將由實現(xiàn)UIViewControllerInteractiveTransitioning的類接管忽刽，而不是由定時器管理天揖，之后就可以隨意設(shè)置動畫狀態(tài)了。
交互動畫往往配合手勢操作跪帝，手勢操作產(chǎn)生一序列百分比數(shù)通過updateInteractiveTransition方法實時更新轉(zhuǎn)場動畫狀態(tài)今膊。
1、現(xiàn)在添加為SecondViewControlle的view添加手勢：
//添加pan手勢
UIPanGestureRecognizer * pan = [[UIPanGestureRecognizer alloc] init];
[pan addTarget:self action:@selector(panGestureRecognizerAction:)];
[self.view addGestureRecognizer:pan];
2伞剑、觸發(fā)轉(zhuǎn)場動畫斑唬，通過手勢產(chǎn)生百分比數(shù)值，更新轉(zhuǎn)場動畫狀態(tài)：
- (void)panGestureRecognizerAction:(UIPanGestureRecognizer *)pan{
//產(chǎn)生百分比
CGFloat process = [pan translationInView:self.view].x / ([UIScreen mainScreen].bounds.size.width);
process = MIN(1.0,(MAX(0.0, process)));
if (pan.state == UIGestureRecognizerStateBegan) {
self.interactiveTransition = [UIPercentDrivenInteractiveTransition new];
//觸發(fā)pop轉(zhuǎn)場動畫
[self.navigationController popViewControllerAnimated:YES];
}else if (pan.state == UIGestureRecognizerStateChanged){
[self.interactiveTransition updateInteractiveTransition:process];
}else if (pan.state == UIGestureRecognizerStateEnded
|| pan.state == UIGestureRecognizerStateCancelled){
if (process > 0.5) {
[ self.interactiveTransition finishInteractiveTransition];
}else{
[ self.interactiveTransition cancelInteractiveTransition];
}
self.interactiveTransition = nil;
}
}
手勢開始狀態(tài)：手勢開始時創(chuàng)建UIPercentDrivenInteractiveTransition對象黎泣，通過popViewControllerAnimated方法觸發(fā)轉(zhuǎn)場動畫恕刘。
手勢變化狀態(tài)：通過計算得到的百分比實時更新轉(zhuǎn)場動畫的狀態(tài)。
手勢取消或者結(jié)束狀態(tài)：根據(jù)完成的百分比決定是否完成轉(zhuǎn)場或者取消轉(zhuǎn)場抒倚。
3褐着、開始轉(zhuǎn)場動畫時，就需要指定一個實現(xiàn)UIViewControllerInteractiveTransitioning協(xié)議的對象來控制轉(zhuǎn)場動畫的狀態(tài)托呕，否則轉(zhuǎn)場動畫狀態(tài)由定時器管理献起。在SecondViewControlle類中，我們通過UINavigationControllerDelegate協(xié)議將interactiveTransition對象傳給UIKit：
- (void)viewDidAppear:(BOOL)animated{
[super viewDidAppear:animated];
self.navigationController.delegate = self;
}
- (id<UIViewControllerInteractiveTransitioning>)navigationController:(UINavigationController *)navigationController interactionControllerForAnimationController:(id<UIViewControllerAnimatedTransitioning>)animationController{
if ([animationController isKindOfClass:[HSPopAnimation class]]) {
return self.interactiveTransition;
}
return nil;
}
以上步驟就將pop的可交互轉(zhuǎn)場動畫完成了镣陕。
push和pop轉(zhuǎn)場動畫基本流程
Note：
- 動畫的狀態(tài)和轉(zhuǎn)場的狀態(tài)是不一樣的谴餐，動畫完成后，不代表轉(zhuǎn)場完成呆抑，所以我們要在動畫的completion里面決定是否完成轉(zhuǎn)場：[transitionContext completeTransition:!transitionContext.transitionWasCancelled];
- 轉(zhuǎn)場是一個過程岂嗓，所有的動畫都在containerView里面完成。
- 不需要交互的轉(zhuǎn)場interactionControllerForAnimationController方法一定要返回nil
?文章的源碼將在完成完成下篇present和dismiss動畫時候上傳鹊碍。
本文作為讀書筆記厌殉，不是科普讀物食绿，所以知識有可能理解錯誤，如有請您不吝賜教公罕。
Demo地址：https://github.com/cnthinkcode/HSPresentTransitionDemo
