使用 iOS Spring Animation API 建立動畫

Spring Animation 是一種特殊的動畫曲線,自從 iOS 7 開始被普遍應用在系統動畫中。swift

下圖中演示的系統自帶的動畫效果,都使用了 Spring Animation:動畫

0-example-2  0-example-1

事實上,從 iOS 7 起幾乎全部的系統動畫都用的是 Spring Animation,包括 App 文件夾打開/關閉效果、鍵盤彈出效果、UISwitch 控件的開關效果、不一樣 View Controller 之間的 Push 動畫、Modal 出現和消失的動畫、Siri 的出現和消失動畫,等等。下圖爲 Spring Animation 和普通的動畫的運動曲線的對比:spa

cmp

爲了更加直觀,我作了一組演示圖,從左至右分別列出了 Spring Animation, Ease-Out Animation 和 Linear Animation 的動畫效果:code

能夠看到,和系統自帶的 ease-out 效果相比,Spring Animation 前期速度增長得更快,在動畫時間必定的前提下,給人感受更加快速、乾淨。ci

Spring Animation API

自 iOS 8 開始,Apple 公開了 Spring Animation 的 API,開發者也能夠使用簡單的代碼建立這類動畫效果了:開發

+ (void)animateWithDuration:(NSTimeInterval)duration
                      delay:(NSTimeInterval)delay
     usingSpringWithDamping:(CGFloat)dampingRatio
      initialSpringVelocity:(CGFloat)velocity
                    options:(UIViewAnimationOptions)options
                 animations:(void (^)(void))animations
                 completion:(void (^)(BOOL finished))completion

該方法是UIView的類方法。get

Spring Animation 的 API 和通常動畫相比多了兩個參數,分別是usingSpringWithDampinginitialSpringVelocityanimation

usingSpringWithDamping 參數

usingSpringWithDamping的範圍爲0.0f1.0f,數值越小「彈簧」的振動效果越明顯。下圖演示了在initialSpringVelocity0.0f的狀況下,usingSpringWithDamping分別取0.2f0.5f1.0f的狀況。it

initialSpringVelocity 參數

initialSpringVelocity則表示初始的速度,數值越大一開始移動越快。下圖演示了在usingSpringWithDamping1.0f時,initialSpringVelocity分別取5.0f15.0f25.0f的狀況。值得注意的是,初始速度取值較高而時間較短時,也會出現反彈狀況。io

使用

Spring Animation 是線性動畫或 ease-out 動畫的理想替代品。因爲 iOS 自己大量使用的就是 Spring Animation,用戶已經習慣了這種動畫效果,所以使用它能使 App 讓人感受更加天然,用 Apple 的話說就是「instantly familiar」。此外,Spring Animation 不僅能對位置使用,它適用於全部可被添加動畫效果的屬性。

 

Cyper筆記 
http://www.cyper.me/2016/06/20/begining-iOS-9-programming-with-swift-part-3/#Animation概述

相關文章
相關標籤/搜索