iOS usingSpringWithDamping动画

小鱼儿 2022-07-16 12:42 178阅读 0赞

![0-example-2.gif][]![0-example-1.gif][]

Spring Animation 是一种特殊的动画曲线，自从 iOS 7 开始被广泛应用在系统动画中。

上图中演示的系统自带的动画效果，都使用了 Spring Animation

事实上，从 iOS 7 起几乎所有的系统动画都用的是 Spring Animation，包括 App 文件夹打开/关闭效果、键盘弹出效果、UISwitch 控件的开关效果、不同 View Controller 之间的 Push 动画、Modal 出现和消失的动画、Siri 的出现和消失动画，等等。下图为 Spring Animation 和普通的动画的运动曲线的对比：

![cmp.png][]

下图是几种动画效果的对比，可以看到，和系统自带的 ease-out 效果相比，Spring Animation 前期速度增加得更快，在动画时间一定的前提下，给人感觉更加快速、干净。

![spring-1.gif][]

这就是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

下面解释一下几个主要参数的意思

`usingSpringWithDamping`的范围为`0.0f`到`1.0f`，数值越小「弹簧」的振动效果越明显。

话不多说，直接上图

![spring-2.gif][]

`initialSpringVelocity`则表示初始的速度，数值越大一开始移动越快。

![spring-3.gif][]

Spring Animation 是线性动画或 ease-out 动画的理想替代品。由于 iOS 本身大量使用的就是 Spring Animation，用户已经习惯了这种动画效果，因此使用它能使 App 让人感觉更加自然，用 Apple 的话说就是「instantly familiar」。此外，Spring Animation 不只能对位置使用，它适用于所有可被添加动画效果的属性。

[0-example-2.gif]: http://img.renfei.org/2014/09/0-example-2.gif
[0-example-1.gif]: /images/20220715/03a695fd86ab4698affb5dcb0df59543.png
[cmp.png]: /images/20220715/20fa54206cfd4f828d3b7455457720b6.png
[spring-1.gif]: /images/20220715/a35589ae44134bbeb00002f8724ec74a.png
[spring-2.gif]: /images/20220715/f485962ea87c4d8dbc10428c277d139c.png
[spring-3.gif]: /images/20220715/d065da410dae4c9d8c86b7073db27436.png