Blend的11种Animation Easing(缓冲动画)动画

来源:互联网 发布:js array后几个 编辑:程序博客网 时间:2024/05/16 02:38
  • 倒退缓冲(BackEase):让动画在继续之前往后退一点。这有点象在斜坡上启动汽车,会往后倒退一点然后才前进。在BackEase中,有一个"Amplitude"属性,该属性可以简单理解为扩展宽度,也就是说动画继续之前往后退的宽度,默认设置为1,随着值的增加,倒退宽度也就越大。
  • 弹跳缓冲(BounceEase):有弹回效果的动画,类似我们前面提到的篮球落下,弹起,再落下,即弹跳反冲。该效果中包含两个属性,"Bounces"是表示弹跳几次,"Bounciness"是表示弹跳的速度,越大会越慢。
  • 圆缓冲(CircleEase):创建使用循环函数加速和/或减速的动画。 基于三角函数(圆函数)来加速动画,一开始的加速度比较慢,越往后加速度越快。
  • 立方体缓冲(CubicEase):创建使用公式加速和/或减速的动画。 与圆缓冲类似,但是是基于立方体函数的时间来产生一个一开始加速度较慢然后越来越快的动画。
  • 伸缩缓冲(ElasticEase):创建表示弹簧在停止前来回振荡的动画。类似于弹跳缓冲(BounceEase),它会让一个值摆动直到停下为止。该效果包含两个属性,"Oscillations"表示伸缩的次数,"Springiness"表示伸缩的速度.
  • 指数缓冲(ExponentialEase):创建使用指数公式加速和/或减速的动画。类似于圆缓冲和立方体缓冲,只是加速度的值是按照指数来变化的。该效果包含属性"Exponent",代表指数,越大效果越慢。
  • 乘方缓冲(PowerEase):创建使用公式  (其中,p 等于 PowerEase.Power  属性)加速和/或减速的动画。这是一种指数缓冲,缓冲的值与时间的乘方成比例。该效果有一个"Power"属性,表示时间t的指数,如果Power=2,则和平方缓冲动画相同效果;Power=3则和立方体缓冲动画效果相同,依次类推.
  • 平方缓冲(QuadraticEase):创建使用公式  加速和/或减速的动画。非常类似于CubicEase,除了在这个缓冲中,值是基于时间的平方。
  • 四次方缓冲(QuarticEase):创建使用公式  加速和/或减速的动画。类似于Cubic和Quadratic,只是值是基于时间的立方。
  • 五次方缓冲(QuinticEase):创建使用公式  加速和/或减速的动画。类似于Cubic、Quadratic和Quartic,值基于时间的五次方。
  • 正弦缓冲(SineEase):创建使用正弦公式加速和/或减速的动画。沿着正弦波来对值进行加速。
原创粉丝点击