自然的动作

标准的动画时间曲线是好用的，但还可以更好，而且它们不足以让你的用户觉得对你的界面感到惊奇和愉悦，因为它们仍然是机器人的感觉，而不是如人类或受外力驱动的物体般完全流动性和自然。如果我们想要让动画变得真正的自然，我们就需要去观察自然世界以及真实的物体的行为，这样我们就可以模仿其动作。这就是软件中迷人、自然的动画的秘密本质：让你的物体动作符合物理法则，这样你界面中的元素就仿佛有了质量和动量，就如在屏幕上滑动或就在你的用户手指下方一般。

所以自然的动作时怎样的呢？符合物理法则的移动例子是什么？好吧，就如下面这个一般。

弹簧的阻尼

一个挂着方块的弹簧。它就如你所期望弹簧上的方块一样移动，因为你之前已经看过或体验过类似的弹簧运动很多次了。它的运动和之前说的简单动画时间曲线有很大的不同。让我们看一下弹簧上物体的动画曲线。

阻尼的震荡运动

这个曲线表示了挂在弹簧上的物体的运动，有很多的属性（例如拉力、摩擦力和阻力）都影响了其动作。如果你观察上图中的深蓝色曲线，它表示欠阻尼的系统，意味着物体在到达最终稳定位置前会来回震荡（反弹）。这就是让动画如上面的例子一般感觉像弹簧上挂着的方块一样需要的动画曲线类型。这种欠阻尼的弹簧动作可以让动画变得有弹性，很多app都在界面动画中采用了这种类型的动作。比如说，Facebook Paper几乎对所有界面动作使用了这种弹簧动作。

上图中中间的蓝色曲线也显示了一个欠阻尼的系统（在稳定前反弹过最终点），但它是一个反弹较少的更加平滑的动作类型。这会导致一个更精细的感觉，而过度反弹的动画会让你的界面变得太丰富或热情。

红色曲线描述了一个很少反弹而且只在到达最终位置前越过一点点的动作。如果物体一点都不震荡和反弹，只是缓慢地到达最终位置，这种弹簧就叫欠阻尼。

让我们看看类似弹簧动作的物体。红色的圆仿佛附有非常有弹性的弹簧一般在移动。绿色的圆带着稍微平滑一些的弹性移动。蓝色的不带有弹性，但会在接近终点值时以指数级衰退速度的动画变得非常的缓慢。

第三个球实际上并没有弹性，但它的动画依然被现实世界的弹簧物理法则所管理，是怎么回事呢？弹簧不是应该有弹性么？如我之前所说，附有弹簧的物体的动作实际上由弹簧的特性决定。想象一个弹簧，组成弹簧的线非常的细。这个弹簧的拉力是非常的松额，如果你在其底部挂上一个小物体，并松开它，你就会看到如红球演示的弹性动作。比较一个拥有更多线圈和更大拉力的更加高强度类型的弹簧。挂在这种类型弹簧上的物体动作会很没有弹性，因为弹簧的属性非常不同。

类似弹簧动作的动画曲线和简单类型动作的动画曲线可能看起来相似（至少他们都是曲线！），但是它们背后的数学运算是非常不同的。如前所说，简单曲线通过三维贝塞尔函数来定义绘制曲线控制点的位置。不幸的是，很多高级类型的曲线不能用贝塞曲线来描述。其中一种曲线就是阻尼弹簧系统。

使用好的拥有弹簧感觉动画的动作类型一般模仿阻尼谐振，其可以调整弹簧末端方块质量、弹簧的刚度、阻尼强度等不同值。

质量是指挂在弹簧末端物体的质量。刚度是指拉伸弹簧的难度，一般由弹簧的厚度和盘绕的密度决定。阻尼强度是指抵抗力度或者摩擦力，就如你尝试在水中快速拖动你的手时受到的阻力。这些是定义一个弹簧动作的关键属性。

如果你想要从头构建起你对web、iOS或其他平台的动画库，并且想要支持类似弹簧的动画，你就需要理解弹簧系统背后大量的数学知识才能正确地实现它。幸运的是，对于iOS，有很多已经存在的优秀的动画框架（由苹果公司或其他人创建）可以用来创建自然的、类似弹簧的动画。

在我们投入动画编码之前，让我们从头开始讨论开发iOS app的基本原则，然后进入界面开发和iOS动画。