話接上篇,實現使用 pinch 手勢來控制 push 和 pop。這個下篇相對上篇沒有那么難啃。
交互動畫條件
從上一篇可知,實現可交互的 push 和 pop 動畫還需要提供交互控制器 Interaction Controller,其遵守UIViewControllerInteractiveTransitioning
協議,不過這個協議其實沒什么用。
看下圖:
交互控制器與動畫控制器的協作過程如下,動畫控制器在其- animateTransition:
中必須使用 UIView Animation 來實現需要的動畫,這也是上篇中不使用 Core Animation 的原因;然后交互控制器根據外部驅動如手勢控制或是其他事件來更新動畫的進度。注意:沒有動畫控制器的情況下交互控制器是無法工作的。
話雖如此,令人驚喜的是在自定義 transition 過程中的發生的所有動畫,不限于- animateTransition:
里提交的動畫,都可以實現交互控制,而且 Core Animation 也支持。但為何蘋果的工程師說必須使用 UIView Animation 呢?交互動畫可以中斷,當外界的驅動比如手勢取消或是在某個階段中斷的話,后續的處理一般是根據進度來決定動畫繼續完成或是取消;而使用而 Core Animation 時,手勢中止時,動畫將停在當前位置。前面說到,沒有放在- animateTransition:
的動畫也可以實現交互控制,比如你可能會在viewWillDisappear:
里執行 UIView Animation,當手勢中止時,視圖會從當前狀態直接跳到動畫的最終值。另外,經嘗試發現,交互動畫只支持UIView block animation 的第一層次,completion Block 中添加的動畫會在第一層次的動畫結束后正常進行,但不能被交互控制器控制。所以,要想實現交互控制,老老實實把所有的動畫都放在動畫控制器的- animateTransition:
里,而且要用 UIView Animation 實現。
UIViewControllerInteractiveTransitioning
協議中的方法對于實現交互動畫幾乎沒什么用處,好在系統已經給我們打包好了一個交互控制器UIPercentDrivenInteractiveTransition
,大部分的情況下我們使用這個類就足夠了。該類提供了以下幾個方法來控制交互的進度:
- updateInteractiveTransition://更新動畫的進度
– cancelInteractiveTransition //取消交互,動畫回放至開始時的狀態
– finishInteractiveTransition //完成轉場,動畫繼續直至 push 或 pop 完成
通過這三個方法,交互控制器就像一個視頻播放器將 push 或 pop 過程中發生的所有動畫當做一部影片來播放。外部的驅動比如手勢用來控制影片的播放進度;當手勢結束或取消時,可以設定影片繼續播放直至結束或是返回至影片開始時。
手勢驅動交互
回到SDENavigationControllerDelegate
類里,實現下面的可選方法來提供交互控制器:
var interactive = false
private (set) var interactionController: UIPercentDrivenInteractiveTransition?
func navigationController(navigationController: UINavigationController, interactionControllerForAnimationController animationController: UIViewControllerAnimatedTransitioning) -> UIViewControllerInteractiveTransitioning? {
// 只可以在 pinch 綁定的方法里才能修改這個屬性
if interactive{
return interactionController
}
return nil
}
這里添加了一個interactive
屬性來標記是否當前動畫是否處于交互控制中,這是因為 pop 的動作還可以使用 navigationbar 上的 Back ButtomItem 來完成,此時若還提供交互控制器的話,會造成 pop transition 過程無法結束。不過你重寫相關方法,并使用finishInteractiveTransition
來結束轉場動畫也是可以的。
接下來添加 pinch 手勢支持。對于 pop 過程,我在默認分支里實現了自動添加 pinch 手勢用于 pop;而對于 push 過程,需要創建新的控制器,而使用者的類未知,而且可能需要其他的初始化設置,因此無法實現自動支持,這也是為什么很多庫只能自動添加 pop 支持的緣故。而你需要 pinch 同時支持 push 和 pop 時,自動支持 pop 的機制就不能使用了。
使用 pinch 支持 push 和 pop 操作,首先在SDENavigationControllerDelegate
里,添加isPush
屬性用于在使用手勢的過程中判斷當前是在進行哪種操作:
var isPush = false
func navigationController(navigationController: UINavigationController, animationControllerForOperation operation: UINavigationControllerOperation, fromViewController fromVC: UIViewController, toViewController toVC: UIViewController) -> UIViewControllerAnimatedTransitioning? {
animationController = SDEPushAndPopAnimationController(operation: operation)
isPush = (operation == .Push)
return animationController
}
的UICollectionViewController
類里添加下面的屬性和方法:
var transitionDelegate: SDENavigationControllerDelegate?
var pinchGestureRecognizer: UIPinchGestureRecognizer?{
didSet(newValue){
collectionView?.addGestureRecognizer(pinchGestureRecognizer!)
}
}
override func viewDidLoad() {
super.viewDidLoad()
pinchGestureRecognizer = UIPinchGestureRecognizer(target: self, action: "handlePinch:")
}
func getIndexPathForGesture(gesture: UIPinchGestureRecognizer) -> NSIndexPath?{
let location0 = gesture.locationOfTouch(0, inView: gesture.view)
let location1 = gesture.locationOfTouch(1, inView: gesture.view)
let middleLocation = CGPointMake((location0.x + location1.x)/2, (location0.y + location1.y)/2)
let indexPath = collectionView?.indexPathForItemAtPoint(middleLocation)
return indexPath
}
func handlePinch(gesture: UIPinchGestureRecognizer){
switch gesture.state{
case .Began:
//設定 pinch 起始向外擴展時實現 push
if gesture.scale >= 1.0{
guard let indexPath = getIndexPathForGesture(gesture) else{
return
}
//保存封面索引位置
self.selectedIndexPath = indexPath
if let toVC = storyboard?.instantiateViewControllerWithIdentifier("XXX"){
transitionDelegate = navigationController?.delegate as? SDENavigationControllerDelegate
transitionDelegate?.interactive = true//只在手勢里標記為 true,要求提供交互控制器
navigationController?.pushViewController(toVC, animated: true)
}
}else{
//如果是向內收縮則實現 pop
//ViewController 被 pop 后,此時已經被移除出 navigation controller 的棧,通過 self.navigationController 返回的只是 nil,因為必須在 pop 前獲取 navigation controller delegate.
transitionDelegate = self.navigationController?.delegate as? SDENavigationControllerDelegate
transitionDelegate?.interactive = true//只在手勢里標記為 true,要求提供交互控制器
self.navigationController?.popViewControllerAnimated(true)
}
case .Changed:
guard transitionDelegate != nil else{
return
}
guard let interactionController = transitionDelegate?.interactionController else{
return
}
var progress = gesture.scale
if transitionDelegate!.isPush{
progress = gesture.scale - 1.0 >= 0.9 ? 0.9 : gesture.scale - 1.0
}else{
progress = 1.0 - gesture.scale
}
//根據手勢的擴張程度來更新動畫進度
interactionController.updateInteractiveTransition(progress)
case .Ended, .Cancelled:
guard transitionDelegate != nil else{
return
}
guard let interactionController = transitionDelegate?.interactionController else{
return
}
var progress = gesture.scale
if transitionDelegate!.isPush{
progress = gesture.scale - 1.0 >= 0.9 ? 0.9 : gesture.scale - 1.0
}else{
progress = 1.0 - gesture.scale
}
//設定一個閾值,用來決定手勢停止或取消時是完成交互還是取消交互
if progress >= 0.4{
interactionController.finishInteractiveTransition()
}else{
interactionController.cancelInteractiveTransition()
}
//確保只在使用 pinch 手勢時才提供動畫的交互
transitionDelegate?.interactive = false
default:
guard transitionDelegate != nil else{
return
}
transitionDelegate?.interactive = false
}
}
可以看出,雖然代碼太長的,但交互動畫的實現還是很簡單的。當然,這個前提是上篇里實現過場動畫時嚴格按照蘋果工程師說的那樣使用 UIView Animation 來實現動畫,而且必須在動畫控制器里的- animateTransition:
里面提交動畫。
自動支持 pinch for pop
從使用角度講,使用 pinch 來 push 的操作是很不直觀的,除非界面沒有給你提供其他選擇,不過頂多不給你提供 NavigationBar,不能通過點擊而是通過 pinch 手勢進入下一級界面的設計顯然是腦殘行為。通過 pinch 來實現 pop 在如今無疑是個很自然的行為,如何實現自動添加 pinch 手勢來支持 pop 呢?顯然,要自動添加,我們就不能在UICollectionViewController
里動手腳。在執行了navigationController?.pushViewController(toVC, animated: true)
這條命令后,系統就會向navigationController
的代理詢問動畫控制器和交互控制器,那么詢問動畫控制器時就是搞小動作的地方:
private (set) var interactionController: UIPercentDrivenInteractiveTransition?
func navigationController(navigationController: UINavigationController, animationControllerForOperation operation: UINavigationControllerOperation, fromViewController fromVC: UIViewController, toViewController toVC: UIViewController) -> UIViewControllerAnimatedTransitioning? {
animationController = SDEPushAndPopAnimationController(operation: operation)
if operation == .Push{
if let toCollectionVC = toVC as? UICollectionViewController{
interactionController = SDEPopPinchInteractionController(toVC: toCollectionVC, holder: self)
}
}
return animationController
}
新的交互控制器在初始化的時候在 toVC 上添加 pinch 手勢,注意避免引用循環:
import UIKit
class SDEPopPinchInteractionController: UIPercentDrivenInteractiveTransition {
private var pinchGesture = UIPinchGestureRecognizer()
private var topVC: UICollectionViewController
private unowned var holder: SDENavigationControllerDelegate
init(toVC topVC: UICollectionViewController, holder: SDENavigationControllerDelegate) {
self.topVC = topVC
self.holder = holder
super.init()
addPinchGestureOnView(self.topVC.view)
}
private func addPinchGestureOnView(view: UIView){
pinchGesture.addTarget(self, action: "sde_handlePinch:")
view.addGestureRecognizer(pinchGesture)
}
internal func sde_handlePinch(gesture: UIPinchGestureRecognizer){
switch gesture.state{
case .Began:
if gesture.scale < 1.0{
holder.interactive = true
topVC.navigationController?.popViewControllerAnimated(true)
}
case .Changed:
if gesture.scale < 1.0{
let progress = 1.0 - gesture.scale
self.updateInteractiveTransition(progress)
}
case .Ended:
if gesture.scale < 1.0{
let progress = 1.0 - gesture.scale
if progress > 0.4{
self.finishInteractiveTransition()
}else{
self.cancelInteractiveTransition()
}
holder.interactive = false
}
default:
holder.interactive = false
}
}
deinit{
pinchGesture.view?.removeGestureRecognizer(pinchGesture)
}
}
注意,由于 push 操作的特殊性,無法自動添加 pinch 手勢來支持 push 操作,如果你需要同時支持兩種操作,那么最好放棄自動添加 pinch 支持 pop 的方式,因為一種手勢不能添加兩種方法。也許你可能嘗試下,在 view 里添加 pinch 手勢用于 pop,在 collectionView 里添加 pinch 里用于 push,限制只能有一個起作用,似乎行不通,不過你可以試試。
我在 Demo 里實現了上述兩種模式:默認分支自動添加 pinch 實現 pop,手動添加 pinch 同時支持 push 和 pop。
后記:
objectivetoast.com 的《Custom Transitions on iOS》是我見過最好的關于 Custom Transition 的文章,甚至 objcc.io 上的兩篇關于 Custom Transition 的文章也不如這篇淺顯易懂,但是其隨后的一篇《Interactive Transition》寫得晦澀難懂,主要是作者的示例可以無限制地 push, 為此作者將 AnimationController、InteractiveController 和 NavigationControllerDelegate 都封裝了起來了,但是卻搞得過于復雜,不是個好的入門例子。
參考資料:
1.View Controller 轉場
2.Interactive Transition