看看UIView动画曲线(第1部分)

所以……设计团队只是要求您使动画更性感,然后您变得苍白。 他们是什么意思? 当他们开始谈论关键帧和动画曲线时,情况变得更加尴尬。

动态图形应用程序提供了很大的灵活性,并且对于设计人员而言,有时可能期望在Swift / Cocoa Touch中可以找到相同的灵活性。 当然,我们都知道Swift很棒,一切皆有可能,但让我们坚持基础。

对于UIView动画,我们可以找到以下曲线预设:

 枚举UIViewAnimationCurve:Int { 
案例EaseInOut
案件缓入
案例缓出
线性情况
}

要尝试这些方法,我将对带有圆角的UIView应用简单的比例转换。

当设计师要求您使动画更性感时,这不是他们的意思。 😉线性曲线是最简单的曲线。 对于我们的比例动画,它使它突然结束。

缓入

入会在开始时弯曲曲线。 应用它时,我们的视图在开始时缩放较慢,因此在结束时缩放较快。 这条曲线在这里不太理想。 由于比例尺从0.0开始,因此早期的转换会以看不见的子像素出现。 几乎就像动画只是延迟了开始一样。

缓出

现在,我们不是在开始时放慢速度,而是在年底时放慢速度。 这对于我们的动画效果更好。

缓入缓出

组合“ 缓入”和“ 缓出”时 ,我们得到一条S形曲线,这会在开始和结束时减慢动画的速度。 由于这是UIView动画的默认曲线,因此我们现在可以将代码重构为:

哇! 我们的曲线迅速脱离图表,并在其稳定下来之前将视图缩放到100%以上。 让我们通过将阻尼比增加到0.7来减少弹簧振荡。

更好。 现在,您当然可以说动画蓝色圆圈永远不会令设计师满意,因此让我们看一个更高级的动画。 在这里,我使用了多个春季动画。 它们中的每一个具有0.8秒的持续时间和0.4的阻尼比。

现在,这一个性感的动画,而我们的春季动画给设计团队留下了深刻的印象。 任务完成!

在我的下一篇文章中,我将进行更深入的介绍,并解释什么是关键帧以及它们如何与UIView动画一起使用。