iOS自定义转场动画
首先介绍下iOS转场动画控制相关API
-
动画控制器 (Animation Controllers)遵从UIViewControllerAnimatedTransitioning协议,并且负责实际执行动画。
-
交互控制器 (Interaction Controllers)通过遵从UIViewControllerInteractiveTransitioning协议来控制可交互式的转场。
-
转场代理 (Transitioning Delegates)根据不同的转场类型方便的提供需要的动画控制器和交互控制器。
-
转场上下文 (Transitioning Contexts)定义了转场时需要的元数据,比如在转场过程中所参与的视图控制器和视图的相关属性。 转场上下文对象遵从UIViewControllerContextTransitioning协议,并且这是由系统负责生成和提供的。
-
转场协调器(Transition Coordinators)可以在运行转场动画时,并行的运行其他动画。 转场协调器遵从UIViewControllerTransitionCoordinator协议。
通过presentViewController:animated:completion:和dismissViewControllerAnimated:completion:这一组函数以模态视图的方式展现、隐藏视图。如果用到了navigationController,还可以调用pushViewController:animated:和popViewController这一组函数将新的视图控制器压栈、弹栈。这些都是系统默认动画效果。
本文主要介绍presentView和navigationController两种形式的自定义转场动画。第一部分是自己写的,第二部分借用了苹果官方代码
1.简单的转场交互处理
带导航的情况
在UINAVigationControllerDelegate的代理中有两个方法是处理转场动画的
image.png
在第一个方法中需要返回一个遵循UIViewControllerAnimatedTransitioning代的OC对象
实现这个方法的时候 push和pop的时候都会调用
- (void)animateTransition:(id <UIViewControllerContextTransitioning>)transitionContext这个方法,你可以在这里处理一些自定义的情况
第二个代理方法需要返回一个遵循UIViewControllerInteractiveTransitioning协议的交互类 当这个方法有返回值的时候,会执行
- (void)startInteractiveTransition:(id<UIViewControllerContextTransitioning>)transitionContext这个方法 你可以在这里做一些自定义情况
不带导航的情况
当present做跳转的时候需要在遵循UIViewControllerTransitioningDelegate的类内实现下面这两个方法 给出返回值
image.png
2.官方转场交互处理
这部分引用了苹果官方demo代码的交互转场部分
-
设置了toViewController的transitioningDelegate属性并且present时,UIKit会从代理处获取animator,其实这里还有一个细节:UIKit还会调用代理的interactionControllerForPresentation:方法来获取交互式控制器,如果得到了nil则执行非交互式动画,这就回到了上一节的内容。
如果获取到了不是nil的对象,那么UIKit不会调用animator的animateTransition方法,而是调用交互式控制器(还记得前面介绍动画代理的示意图么,交互式动画控制器和animator是平级关系)的startInteractiveTransition:方法。 -
所谓的交互式动画,通常是基于手势驱动,产生一个动画完成的百分比来控制动画效果(文章开头的gif中第二个动画效果)。整个动画不再是一次性、连贯的完成,而是在任何时候都可以改变百分比甚至取消。这需要一个继承自UIPercentDrivenInteractiveTransition的交互式动画控制器和animator协同工作。这看上去是一个非常复杂的任务,但UIKit已经封装了足够多细节,我们只需要在交互式动画控制器和中定义一个时间处理函数(比如处理滑动手势),然后在接收到新的事件时,计算动画完成的百分比并且调用updateInteractiveTransition来更新动画进度即可。
image.png
本文demo地址
喜欢的话可以点个星星
本文参考文档
https://juejin.im/post/5a309c466fb9a0451c3a6120
网友评论