转场动画分为两种
导航栏转场
使用模态转场
转场动画就是一个控制器切换到另一个控制器之间的过程，在这个过程中获取到两个控制器，然后对对应的view做出动画
实现转场动画，在脑海中先想一下如果需要实现这样的动画我们都需要哪些东西，首先我们要有一个导航栏控制器，导航栏中有A这个控制器，现在要从A跳到B， A push B的时候是一个动画，B pop A的时候又是一个动画，用一个导航栏model控制展示我们要使用哪种动画。所以我们需要的东西有
一个导航栏控制器
A控制器 B控制器
pushModel ~ A push B的时候需要的动画
popModel ~ B pop A的时候需要的动画
导航栏代理navModel ~ 选择使用动画
- 我们自定义一个导航栏代理navModel，并遵循实现
- 将要跳转的控制器导航栏代理设置为我们的导航栏代理navModel
self.navigationController.delegate = self.navModel; - 创建转场动画需要的pushModel和popModel，遵循并实现
- 在navModel中设置对应的转场所需要的model
导航栏转场
1.设置导航栏代理model，遵守并实现
- (nullable id )navigationController:(UINavigationController *)navigationController
animationControllerForOperation:(UINavigationControllerOperation)operation
fromViewController:(UIViewController *)fromVC
toViewController:(UIViewController *)toVC{
if (operation == UINavigationControllerOperationPush) {
return self.customPush;
}else if (operation == UINavigationControllerOperationPop){
return self.customPop;
}
return nil;
}
2.遵守并实现
//转场动画时间
- (NSTimeInterval)transitionDuration:(nullable id )transitionContext{
return 0.5;
}
//转场动画效果
- (void)animateTransition:(id )transitionContext{
//转场过渡的容器view -- UINavigationTransitionView
UIView *containerView = [transitionContext containerView];
//FromVC
UIViewController *fromViewController = [transitionContext viewControllerForKey:UITransitionContextFromViewControllerKey];
UIView *fromView = fromViewController.view;
fromView.frame = CGRectMake(0, 0, kScreenWidth, kScreenHeight);
//ToVC
UIViewController *toViewController = [transitionContext viewControllerForKey:UITransitionContextToViewControllerKey];
UIView *toView = toViewController.view;
toView.frame = CGRectMake(0, 0, kScreenWidth, kScreenHeight);
//此处判断是push，还是pop 操作
BOOL isPush = ([toViewController.navigationController.viewControllers indexOfObject:toViewController] > [fromViewController.navigationController.viewControllers indexOfObject:fromViewController]);
if (isPush) {
[containerView addSubview:fromView];
[containerView addSubview:toView];//push,这里的toView 相当于secondVC的view
toView.frame = CGRectMake(kScreenWidth, kScreenHeight, kScreenWidth, kScreenHeight);
}else{
[containerView addSubview:toView];
[containerView addSubview:fromView];//pop,这里的fromView 也是相当于secondVC的view
fromView.frame = CGRectMake(0, 0, kScreenWidth, kScreenHeight);
}
//因为secondVC的view在firstVC的view之上，所以要后添加到containerView中
//动画
[UIView animateWithDuration:[self transitionDuration:transitionContext] animations:^{
if (isPush) {
toView.frame = CGRectMake(0, 0, kScreenWidth, kScreenHeight);
}else{
fromView.frame = CGRectMake(kScreenWidth, kScreenHeight, kScreenWidth, kScreenHeight);
}
} completion:^(BOOL finished) {
BOOL wasCancelled = [transitionContext transitionWasCancelled];
//设置transitionContext通知系统动画执行完毕
[transitionContext completeTransition:!wasCancelled];
}];
}
模态转场动画
1.先在A控制器中设置transitioningDelegate代理为model,model遵循并实现
- (nullable id )animationControllerForPresentedController:(UIViewController *)presented presentingController:(UIViewController *)presenting sourceController:(UIViewController *)source{
// Presented 转场动画model
return self.customPush;
}
- (nullable id )animationControllerForDismissedController:(UIViewController *)dismissed{
//Dismiss转场动画model
return self.customPop;
}
2.第二步同导航栏转场一样
交互式转场
- 在B控制器中设置代理方法
- 在navModel中设置交互手势的类
- 手势类panModel继承自
### 设置push或者pop需要用到的类
- (nullable id )navigationController:(UINavigationController *)navigationController
animationControllerForOperation:(UINavigationControllerOperation)operation
fromViewController:(UIViewController *)fromVC
toViewController:(UIViewController *)toVC{
if (operation == UINavigationControllerOperationPush) {
return self.customPush;
}else if (operation == UINavigationControllerOperationPop){
return self.customPop;
}
return nil;
}
###设置交互手势
- (nullable id )navigationController:(UINavigationController *)navigationController
interactionControllerForAnimationController:(nonnull id)animationController{
if (self.gestureRecognizer)
return self.percentIntractive;
else
return nil;
}
设置转场交互动画
#import "LYNavKuGouPercentDerivenInteractive.h"
@interface LYNavKuGouPercentDerivenInteractive ()
@property (nonatomic, strong, readonly) UIPanGestureRecognizer *gestureRecognizer;
@end
@implementation LYNavKuGouPercentDerivenInteractive
- (void)startInteractiveTransition:(id )transitionContext{
//此句话的重要性
[super startInteractiveTransition:transitionContext];
}
- (instancetype)initWithGestureRecognizer:(UIPanGestureRecognizer *)gestureRecognizer
{
self = [super init];
if (self)
{
_gestureRecognizer = gestureRecognizer;
[_gestureRecognizer addTarget:self action:@selector(gestureRecognizeDidUpdate:)];
}
return self;
}
- (void)dealloc
{
[self.gestureRecognizer removeTarget:self action:@selector(gestureRecognizeDidUpdate:)];
}
- (CGFloat)percentForGesture:(UIPanGestureRecognizer *)gesture
{
CGPoint translation = [gesture translationInView:gesture.view];
CGFloat scale = 1 - fabs(translation.x / kScreenWidth);
scale = scale < 0 ? 0 : scale;
return scale;
}
- (void)gestureRecognizeDidUpdate:(UIPanGestureRecognizer *)gestureRecognizer
{
CGFloat scale = 1 - [self percentForGesture:gestureRecognizer];
NSLog(@"interactive %f",scale);
switch (gestureRecognizer.state)
{
case UIGestureRecognizerStateBegan:
//没用
break;
case UIGestureRecognizerStateChanged:
[self updateInteractiveTransition:scale];
break;
case UIGestureRecognizerStateEnded:
if (scale < 0.2f){
[self cancelInteractiveTransition];
}
else{
[self finishInteractiveTransition];
}
break;
default:
[self cancelInteractiveTransition];
break;
}
}
注意点
- 如果是交互性的转场，需要navModel同时遵循并实现
- 导航栏转场设置
self.navigationController.delegate
模态转场:
//1. 设置代理
second.transitioningDelegate = self.animatedTransition;
//2.跳转
[self presentViewController:second animated:YES completion:nil];```
参考网址：[仿微信图片浏览转场、酷狗转场 - iOS自定义转场动画(入门篇)](http://www.jianshu.com/p/ec08f43808aa)<这里介绍的很详细>