交互式转场动画
交互式转场动画，提高动画与用户交互性，从而提升用户体验。
通过手势、重力感觉等交互操作，使原本连贯的动画分解，逐渐变化。
思路：
把原本的动画的过渡，抽象成百分比形式（UIPercentDrivenInteractiveTransition协议实现原理），与交互操作的变化系数关联起来。
UIPercentDrivenInteractiveTransition
UIViewControllerInteractiveTransitioning 协议为我们提供一系列便利的方法，可以通过一个百分比控制交互切换的过程
从系统的api可以看出，交互式转场动画兼容iOS7以上
- update(float)
更新动画进度的百分比，一般通过手势识别长度计算出的值 - cancel ( )
取消交互，返回切换前的状态 - finish ( )
完成交互，更新到切换后的状态
demo
【交互式转场动画】，是建立在【非交互式转场动画】的基础之上
【非交互式】只需要提供present和dismiss的动画即可
【交互式】则需要在【非交互式】基础上多提供--交互式动画控制器
ps: <a href = "http://www.jianshu.com/p/4e9ccd0699fb">非交互式转场动画</a>，我之前也有文章涉及，这里就不作细述
新建一个工具类继承于UIPercentDrivenInteractiveTransition，实现交互切换的协议
import UIKit
//判断是【交互式】还是【非交互式】
private var isInteractive = false
//判断是presented还是dismiss
private var isPresenting = false
class MenuTransitionHepler: UIPercentDrivenInteractiveTransition,UIViewControllerAnimatedTransitioning,UIViewControllerTransitioningDelegate {
//step.4
//实现UIPercentDrivenInteractiveTransition交互切换协议
//present切换启动手势
private var enterPanGesture: UIScreenEdgePanGestureRecognizer!
//present交互动画控制器
var sourceViewController : UIViewController! {
didSet{
self.enterPanGesture = UIScreenEdgePanGestureRecognizer()
self.enterPanGesture.addTarget(self, action: #selector(MenuTransitionHepler.handelOnStagePan(pan:)))
self.enterPanGesture.edges=UIRectEdge.left
self.sourceViewController.view.addGestureRecognizer(self.enterPanGesture)
}
}
//present手势长度比率，控制动画进度
func handelOnStagePan(pan:UIPanGestureRecognizer){
let view_transition = pan.translation(in: pan.view!.superview)
//手势滑动长度与屏幕宽度的比率，用于控制切换动画进度
let d = view_transition.x / (pan.view?.bounds.width)! * 0.5
print(d)
switch pan.state {
case UIGestureRecognizerState.began:
isInteractive=true
//调用fromVC调用present方法，此方法是storyboard的线跳
self.sourceViewController.performSegue(withIdentifier: "presentMenu", sender: self)
break
case UIGestureRecognizerState.changed:
//更新切换动画进度
self.update(d)
break
default:
isInteractive = false
if(d > 0.2){
//更新动画到完成状态
self.finish()
}
else {
//返回动画到切换前的状态
self.cancel()
}
break
}
}
//dismiss切换启动手势
private var exitPanGesture: UIPanGestureRecognizer!
//dismiss交互动画控制器
var menuViewController: UIViewController! {
didSet {
self.exitPanGesture = UIPanGestureRecognizer()
self.exitPanGesture.addTarget(self, action:#selector(MenuTransitionHepler.handleOffstagePan(pan:)))
self.menuViewController.view.addGestureRecognizer(self.exitPanGesture)
}
}
//dismiss手势长度比率，控制动画进度
func handleOffstagePan(pan: UIPanGestureRecognizer){
let view_transition = pan.translation(in: pan.view!)
let d = view_transition.x / (pan.view?.bounds.width)! * -0.5
switch pan.state {
case UIGestureRecognizerState.began:
isInteractive=true
self.menuViewController.dismiss(animated: true, completion: nil)
break
case UIGestureRecognizerState.changed:
self.update(d)
break
default:
isInteractive = false
if(d > 0.1){
self.finish()
}
else {
self.cancel()
}
break
}
}
}
上述代码中，主要实现几个功能：
1、添加present和dismiss的动画切换控制器（即VC）
2、为VC添加交互手势
3、设置手势响应方法，判断手势状态更新切换进度
在MenuTransitionHepler工具类最外面，添加 UIViewControllerTransitioningDelegate的实现方法
//step.1
//UIViewControllerTransitioningDelegate代理方法
extension MenuTransitionHepler{
//presented
func animationController(forPresented presented: UIViewController, presenting: UIViewController, source: UIViewController) -> UIViewControllerAnimatedTransitioning? {
isPresenting=true
return self
}
//dismissed
func animationController(forDismissed dismissed: UIViewController) -> UIViewControllerAnimatedTransitioning? {
isPresenting=false
return self
}
func interactionControllerForPresentation(using animator: UIViewControllerAnimatedTransitioning) -> UIViewControllerInteractiveTransitioning? {
return isInteractive ? self : nil
}
func interactionControllerForDismissal(using animator: UIViewControllerAnimatedTransitioning) -> UIViewControllerInteractiveTransitioning? {
return isInteractive ? self : nil
}
}
接下来就是实现非交互切换的方法（交互式切换需要实现此方法），这里就卖个关子，感兴趣的童鞋可以看demo源码
最后在fromVC设置自定义present的动画控制器和代理
import UIKit
class fromVC: UIViewController {
//step.5
//初始化自定义转场动画协议对象
let transitionHelper = MenuTransitionHepler()
override func viewDidLoad() {
super.viewDidLoad()
//step.6
//设置转场动画的fromVC
self.transitionHelper.sourceViewController=self
}
override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
//step.7
//设置转场动画的toVC
let menu = segue.destination as! MenuVC
//step.8
//设置transitioningDelegate为【自定义转场协议】
menu.transitioningDelegate = self.transitionHelper
self.transitionHelper.menuViewController = menu
}
}
finish！如果在左边缘开始滑动，效果如下图：P
总结
总体来说，iOS7后实现转场动画确实很方便
非交互式转场动画，实现转场协议，设置动画时间、动画逻辑、动画实现即可
交互式转场动画，则在非交互式的基础上，多设置动画控制器（VC）、触发交互的方法
附带 <a href = "https://github.com/marceChow/-/tree/%E5%8A%A8%E7%94%BB%E7%B3%BB%E5%88%97">Demo</a>传送门，demo实现效果比较简单，后期也有改成侧滑框架的可能
