彈性動畫方法animateWithDuration: delay: usingSpringWithDamping: initialSpringVelocity: options: animations...

weixin_33749242發表於2016-09-12

這個動畫效果是從IOS7開始有的,個人覺得動畫效果的使用者體驗很好,用起來也方便,但是這裡面的dampingRatio和velocity涉及到物理力學的知識,比較難理解和計算,只能通過Demo試驗來理解它所代表的意思。通過形象生動的比喻來理解它。

Performs animations using a timing curve described by the motion of a spring. When dampingRatio is 1, the animation will smoothly decelerate to its final model values without oscillating. Damping ratios less than 1 will oscillate more and more before coming to a complete stop. You can use the initial spring velocity to specify how fast the object at the end of the simulated spring was moving before it was attached. It's a unit coordinate system, where 1 is defined as travelling the total animation distance in a second. So if you're changing an object's position by 200pt in this animation, and you want the animation to behave as if the object was moving at 100pt/s before the animation started, you'd pass 0.5. You'll typically want to pass 0 for the velocity.

方法呼叫:

[UIView animateWithDuration:duration
     
                          delay:delayTime
     
         usingSpringWithDamping:dampingRate
     
          initialSpringVelocity:velocity options:options
     
                     animations:^{
                         //code here
                     } completion:nil];
  • usingSpringWithDamping:彈簧動畫的阻尼值,也就是相當於摩擦力的大小,該屬性的值從0.0到1.0之間,越靠近0,阻尼越小,彈動的幅度越大,反之阻尼越大,彈動的幅度越小,如果大道一定程度,會出現彈不動的情況。換句話說, 範圍 0~1 當它設定為1時,動畫是平滑的沒有振動的達到靜止狀態,越接近0 振動越大

  • initialSpringVelocity:就是形變的速度,從視覺上看可以理解彈簧的形變速度,到動畫結束,該速度減為0,所以,velocity速度越大,那麼形變會越快,當然在同等時間內,速度的變化(就是速率)也會越快,因為速度最後都要到0。值越小彈簧的動力越小,彈簧拉伸的幅度越小,反之動力越大,彈簧拉伸的幅度越大。這裡需要注意的是,如果設定為0,表示忽略該屬性,由動畫持續時間和阻尼計算動畫的效果。

補充
當usingSpringWithDamping屬性值為0.1時,表示阻尼很小,雖然沒有動力因素的影響,但登入按鈕彈動的幅度依然比較大,相當於在冰面滑行一樣。當該屬性為1時,表示阻尼非常大,可以看到登入按鈕幾乎是沒有什麼彈動的幅度。這就是阻尼的效果。

值的注意的一點是,彈簧動畫並不只作用於位置的變化,它可以作用於所有動畫屬性的變化,比如我們在animations的閉包中除了位置的變化外,還有透明度的變化,它也同樣有彈簧動畫的效果,只不過它沒有位置變化那麼明顯和貼近真實,它會表現出一閃一閃的效果:

相關文章