在iPhone上平滑動畫的簡單策略

    可直接操作的使用的iPhone - 你真的拿在手裏,並用指尖操縱它的感覺是革命性的。雖然許多移動平臺有觸摸功能,這是iphone現實物理和流暢的動畫,使它區別於它的競爭對手。

    然而,糟糕的滾動毀掉了體驗。Twitter針對iphone 4.0的新UI包含了許多可能影響性能的細節,所以我們不得不以處理60幀每秒的動畫爲優先。如果您正發現並排除動畫性能,這個帖子應該可以提供一些有用的建議。


    層的檢查


    動畫在iOS上是由Core Animation層推動的。層是一個跟GPU一起工作的簡單抽象。當層運動,GPU只是作爲一個硬件本身的擴展功能變換了表層。然而GPU不會爲繪製優化。你view裏drawRect: 方法裏的所有東西都被CPU處理,然後作爲紋理傳遞給GPU。


    動畫問題陷入在管道中的兩個階段。無論是GPU負擔昂貴的操作,或者是CPU在交到GPU之前花費太多時間去準備cell。下面的章節包含簡單的指令基於我們如何解決這些挑戰


    GPU的瓶頸

    當GPU負擔過重,表現低,但幀率一致最常見的原因可能是過度合成,混合,或像素錯位。考慮下面的Tweet

wKioL1SH7_-R4vzUAAA6fbHp5k0325.jpg\"


使用直接繪製

一個單純的Tweet cell實現可能包含一個 UILabel 作爲用戶名, 一個 UILabel 作爲tweet的文字, 一個 UIImageView 作爲頭像, 等等。

wKiom1SH8DSy2rxOAABFGLufsls031.jpg\"


    不幸的是每一個視圖要負擔Core Animation額外的合成

    相反,我們的tweet cell含有一個沒有子視圖的單一視圖一個單一的drawRect: 繪製所有。

我們通過創建一個通用的table view cell制度化地直接繪製,來爲 drawRect:方法接受一個block。這是到目前爲止,在應用程序中常用的cell

wKioL1SH9POS3xGcAAA-66m84B0755.jpg\"

    避免混合

    你會注意到Tweets在iPhone 4上的紋理背景的上面有一個垂下的陰影。這表現是一個挑戰,作爲混合是昂貴的

    我們通過減少Core Animation不得不考慮的非不透明的面積,從cell的內容區域上分離陰影區域來解決這個問題

    爲了快速發現混合,可以選擇Core Animation instrument裏Instruments下的 Color Blended Layers選項。綠色區域表示不透明紅色指示出混合的表面

wKiom1SH9Gqz2OtiAAA-ZUYG_yE881.jpg\"


檢查像素對齊

發現以下代碼中的危險

CGRect subframe = CGRectMake(x, y, width / 2.0, height / 2.0);

如果寬度是奇數,則subFrame將有一個分數的寬度。Core Animation將接受這一點,但它需要反鋸齒處理,這是昂貴的。相反,運行floor 或 ceil 計算值

Instruments下檢查Color Misaligned Images尋找偶然的反鋸齒處理


cell準備的瓶頸

    動畫第二類問題稱爲“pop”並且發生在新的cell滾動進入視圖。當一個cell即將出現在屏幕上,在drop一個框架之前它只有17毫秒來提供內容


循環利用cell

    如table view文檔中的描述無論何時他們出現或消失應該循環利用cell在

dequeueReusableCellWithIdentifier:的幫助下,而不是創建和銷燬cell對象。

優化你的 drawRect:

    如果你是直接繪製和循環利用cell,你仍然會看到一個pop,檢查你drawRect: 的時間:Instruments下的Core Animation。如果需要,消除“nice to have”細節敏感的坡度


如果必要的話請渲染

    有時,你不能簡化繪製。 iPhone 4.0 Twitter中的新的#Discover tab在cell中顯示大圖。不管多麼簡單處理縮放和裁剪一個大的圖像是昂貴的


    我們知道#Discover有一個十個story的上限,所以我們決定交換CPU的內存。當我們收到一個熱門story圖片我們先對低優先級背景隊列的cell渲染,並將其存儲在cache中。當cell滾入視圖我們設置celllayer.contents預焙CGImage不需要繪製


結論

所有的這些優化的代價是代碼的複雜性和開發人員的生產力。只要你不讓自己陷入一個建築的角落你可以經常在你寫的最簡單的東西工作了,並收集硬件的實際測量數據之後應用這些優化的事

記住:過早優化是萬惡之源






發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章