介紹Facebook的Pop
在2014年4月，F(xiàn)acebook的工程師Kimon Tsinteris發(fā)布了Pop，F(xiàn)acebook構(gòu)建用來支撐他們app Paper的一個彈簧動畫框架。這個框架的起源其實早于Facebook，Kimon構(gòu)建了其中的大部分用來支撐他被Facebook于2011年收購的電子書公司Push Pop Press。你可能記得Push Pop Press，它獲得了蘋果的設(shè)計獎，作為iPad的電子書，為被稱為“Our Choice”的AI Gore所構(gòu)建。
點擊觀看AI Gore’s ‘Our Choice’ - an iPad app視頻
“Our Choice”在2011年確實很有開創(chuàng)性。它是最早的有完整的基于手勢來操作界面內(nèi)容的iOS app之一。屏幕上的每個視覺元素都是彈簧動畫的，有著很好的彈性和響應(yīng)，這是從所未見的。
時間快進(jìn)到2014年早期，來介紹一些Facebook的Paper。Paper同樣包含基于手勢的控制和彈簧動畫，并且可以發(fā)現(xiàn)，它全部基于Al Gore三年前的電子書的工作。對我們開發(fā)者來說幸運的是，F(xiàn)acebook認(rèn)為他們的動畫框架Pop值得公開到社區(qū)中去，這樣其他人也能構(gòu)建酷的基于彈簧動畫的app了。
Pop VS Core Animation
當(dāng)我們在本書前面討論Core Animation的時候，以及它是如何在一個基本的水平上工作的，我結(jié)識了model layer和presentation layer的不同。模型層表示已知的準(zhǔn)確的CALayer預(yù)加到動畫上的屬性。如果你添加一個動畫到layer上，然后在動畫進(jìn)行到一半時問模型層它的屬性是什么，答案是不會反映任何動畫當(dāng)前的內(nèi)容的。如果你想要知道動畫中實時的、運動中的layer的值，你就得去看表現(xiàn)層。而一旦動畫完成后，表現(xiàn)層就會消失，所以如果你不想你的layer回到開始的位置，你就需要設(shè)置模型層的屬性來匹配動畫的最終狀態(tài)。
這就是Core Animation的工作。這是蘋果為了構(gòu)建一個iPhone上用的動畫框架在很多年前做出的一個基本的實現(xiàn)選擇。而因為JNWSpringAnimation簡單地為我們開發(fā)了一個依然是Core Animation對象的CAKeyframeAnimation，我們還是需要設(shè)置動畫模型層的最終值來在完成時保持住。
Pop是完全不同的！
Pop不使用Core Animation來執(zhí)行任何它提供的動畫功能。不同之處在于它設(shè)置了一個特殊的時間對象來每1/60秒執(zhí)行一次。那個每秒執(zhí)行60次的代碼會直接基于下一個你在彈簧動作中定義的位置更新任何你想要的屬性。沒有什么特別的、額外的layer添加到你的元素中去，Pop直接在UIView或者CALayer上改變屬性，或者，有趣地在任何你想要的對象類型上改變。這意味著在動畫中的任何時候，你都可以直接接觸改變的屬性的當(dāng)前值而不用跳到任何表現(xiàn)層。并且更好的是，你不需要單獨設(shè)置最終值讓動畫在那逗留，因為動畫始終在實際的真實值上工作。
這個Pop用來支撐整個框架的時間對象是CADisplayLink，它可以看做是NSTimer的一個更高級版本，NSTimer是Mac游戲開發(fā)者常年用來在他們的Mac和iOS游戲中一幀幀運行代碼的。NSTimer可以在你想要的任何時候調(diào)用任何你想調(diào)用的代碼，不斷地重復(fù)或者只調(diào)用一次。如果你想每5秒鐘調(diào)用一次代碼就可以使用NSTimer來做?；蛘呷绻阆胍棵胝{(diào)用代碼60次，也可以用NSTimer來做，但當(dāng)這么快地調(diào)用代碼的時候（比如每次運動一點點像素，一步步地動畫一個界面元素），這個時間對象就會失去準(zhǔn)確的同步刷新頻率，你可能會丟失一些幀，從而導(dǎo)致一些奇怪的短暫跳躍。
這就是CADisplayLink施展之處。CADisplayLink就是設(shè)計來避免這個問題的，因為它不是設(shè)置時間間隔，它一遍遍地調(diào)用你的方法的速率完全取決于屏幕的刷新頻率。它隨著屏幕的刷新來啟動你的代碼，這樣你就有了最好的機(jī)會來每秒更新你的界面60次（平滑感知動作的時間）。這就是Pop用來將動畫一像素一像素、1/60秒一次推動的方法。
查看完整合集（喜歡請打星~）：https://github.com/Cloudox/Motion-Design-for-iOS
