一. 轉(zhuǎn)場效果演示:
二. 實(shí)現(xiàn)原理
? ? ? 上圖顯示的動畫分為Presentation animations?和Dismissal animations.?
? ? ? 點(diǎn)擊右下角紫色按鈕(即"加入購物車"按鈕), 即觸發(fā)Presentation: 先設(shè)置toView(橙色視圖)的frame, 并將toView平移到屏幕下方, 然后使用塊動畫讓fromView(展示手表信息的視圖)X方向上旋轉(zhuǎn) π?/ 16 度, Z方向上移動-100, 并恢復(fù)toView的transform為默認(rèn)值. 在當(dāng)前塊動畫完成的回調(diào)中嵌套一個(gè)塊動畫, 以實(shí)現(xiàn)fromView在X. Y方向上縮放為原先的0.9. 嵌套塊動畫的完成回調(diào)中, 調(diào)用UIView的擴(kuò)展方法toRetinaImage() -> (UIImage)來繪制fromView, 將其添加到transitionContext的containerView第0層.并調(diào)用?transitionContext.completeTransition(true)告知轉(zhuǎn)場結(jié)束.還有一個(gè)蒙版的細(xì)節(jié),這個(gè)實(shí)現(xiàn)比較簡單,直接添加在fromView和toView之間.?
? ? ? ? 在蒙版上添加一個(gè)tap手勢, 觸發(fā)Dismissal. 此時(shí)的fromView是指橙色視圖. 而toView是指展示手表信息的控制器視圖,由于它在Presentation完成時(shí)即已從屏幕上移除(并未釋放). toView默認(rèn)是顯示在fromView之上的, 所以通過insert在fromView之下改變兩者的層級關(guān)系, 然后在Dismissal animations的塊動畫中使fromView平移到屏幕下方, toView的transform恢復(fù)成默認(rèn)值, 動畫完成的回調(diào)中調(diào)用?transitionContext.completeTransition(true).
源碼地址:https://github.com/moonCai/AddShoppingCartTransitionAnimation
三. 思考討論
? ? 蘋果官方文檔對于自定義轉(zhuǎn)場動畫的介紹中:
" Swapping the values makes it easier to write a single animator that handles both presentations and dismissals. When you design your animator, all you have to do is include a property to know whether it is animating a presentation or dismissal. The only required difference between the two is the following:
For a presentation, add the “to” view to the container view hierarchy.
For a dismissal, remove the “from” view from the container view hierarchy."
? ? ?在Dismissal animations執(zhí)行完之后, 我的代碼中沒有移除“from” view, 但是通過視圖斷點(diǎn), 卻看不到“from” view. 之前添加到轉(zhuǎn)場環(huán)境容器視圖上的截圖和蒙版貌似也未顯示. 通過認(rèn)真研讀文檔和測試, 本人得出以下兩個(gè)觀點(diǎn)(如有不同見解, 歡迎交流指正):
1.?Presentation animations轉(zhuǎn)場執(zhí)行完后, 通過控制臺打印發(fā)現(xiàn)"from"View的frame 是frame = (20.7 36.8; 372.6 662.4), 但視圖層級上并未顯示.基于此, 我認(rèn)為此時(shí)fromView和轉(zhuǎn)場環(huán)境的容器視圖的父子視圖關(guān)系解除.
2.?Dismissal animations執(zhí)行完以后, 打印轉(zhuǎn)場環(huán)境的容器視圖, 顯示此時(shí)容器視圖已被釋放. 那么添加在它上面的子視圖也對應(yīng)會執(zhí)行一次release. 但我在自定義push和pop的轉(zhuǎn)場時(shí)發(fā)現(xiàn)此時(shí)容器視圖并未銷毀, 那么添加在其上的子視圖(fromView dimmingView 和imageView)都應(yīng)該removeFromSuperView, 及時(shí)釋放內(nèi)存. 所以,在這里還是建議按照蘋果文檔中所說的: ?For a dismissal, remove the “from” view from the container view hierarchy.
