仿格瓦拉電影點擊效果

一直覺得格瓦拉的點擊動效做的很好,一直很想模仿一下,但是,懶癌患者啊。
前面也看到了葉孤城大大(好像是,但是看github和簡書都沒有了?)和
這位帥哥的代碼,其實他們已經(jīng)將80%的工作都做了,我加的很少。
終于昨天下定決心要把它擼出來(污一波,嘻嘻)
效果如圖:

d2f0bbaddab0ad6109d3fd31005537da.gif

不知道模仿了多少,大概意思吧。

轉(zhuǎn)場動畫

在iOS7之后,蘋果提供了自定義轉(zhuǎn)場動畫的API,具體的可以閱讀obj.cn的文章,這里面講的很詳細,首先就是要自定義一個實現(xiàn)UIViewControllerAnimatedTransitioning 這個協(xié)議的對象,由這個對象負責(zé)處理轉(zhuǎn)場的動畫.

UIViewControllerAnimatedTransitioning協(xié)議

該協(xié)議由2個需要我們實現(xiàn)的方法,

  • (NSTimeInterval)transitionDuration:(id <UIViewControllerContextTransitioning>)transitionContext和
  • (void)animateTransition:(id<UIViewControllerContextTransitioning>)transitionContext
    上面的是動畫的時長,下面的方法提供了一個context,從該context里面我們可以的到轉(zhuǎn)場的開始和結(jié)束控制器,時長我們設(shè)定為1秒鐘
    時長.png

    第二個方法內(nèi)我們的代碼比較多
    第二個方法.png

    首先是獲取開始的controller和結(jié)束的controller,然后我們開始做動畫。
    首先是位移動畫,這里直接使用UIview的動畫偷懶,哈哈。設(shè)置開始controller的imageview的frame從開始的controller變?yōu)榻Y(jié)束的controller的(有點繞),并要設(shè)置shadow,使imageview有種提上來的感覺。
    結(jié)束之后將結(jié)束controller顯示出來,并開始mask動畫,就是上文提到的那么仁兄的思路(有關(guān)mask動畫不懂的可以Google一下),到此大部分動畫就完成了,但是如果要做到格瓦拉那樣的,還需要多做點其他的操作。
    這篇干貨基本等于0,獻丑了。
    在此要感謝HenryCheng
    相關(guān)資料:
    http://www.lxweimin.com/p/8c29fce5a994
    http://objccn.io/issue-5-3/
    代碼放在github
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

推薦閱讀更多精彩內(nèi)容