search

zhishu520 / blog

一个关于游戏开发的博客(*^__^*)
3 stars 0 forks source link

cocos ActionEase 动画曲线 #7

Open zhishu520 opened 5 years ago

zhishu520 commented 5 years ago

前端做动画的时候肯定会用到一些动画缓冲曲线模型，这里做下记录。

EaseInEaseOutEaseInOut 　　　　EaseIn　　　　　　　　EaseOut　　　　　　　　EaseInOut

QuadEaseInQuadEaseOutQuadEaseInOut 　　　QuadEaseIn　　　　　QuadEaseOut　　　　QuadEaseInOut

CubicEaseInCubicEaseOutCubicEaseInOut 　　　CubicEaseIn　　　　　CubicEaseOut　　　　CubicEaseInOut

QuartEaseInQuartEaseOutQuartEaseInOut 　　　QuartEaseIn　　　　　QuartEaseOut　　　　QuartEaseInOut

QuintEaseInQuintEaseOutQuintEaseInOut 　　　QuintEaseIn　　　　　　QuintEaseOut　　　　　QuintEaseInOut

EaseExponentialInEaseExponentialOutEaseExponentialInOut 　　EaseExponentialIn　　EaseExponentialOut　　EaseExponentialInOut

SineEaseInSineEaseOutSineEaseInOut 　　　SineEaseIn　　　　　　SineEaseOut　　　　　　SineEaseInOut

CircEaseInCircEaseOutCircEaseInOut 　　　CircEaseIn　　　　　　CircEaseOut　　　　　　CircEaseInOut

BackEaseInBackEaseOutBackEaseInOut 　　　BackEaseIn　　　　　　BackEaseOut　　　　　BackEaseInOut

ElasticEaseInElasticEaseOutElasticEaseInOut 　　　ElasticEaseIn　　　　　ElasticEaseOut　　　　ElasticEaseInOut

BounceEaseInBounceEaseOutBounceEaseInOut 　　　BounceEaseIn　　　　BounceEaseOut　　　　BounceEaseInOut

说明

  1. EaseBezierAction 因为有参数，不好绘画，这里给出一个网站http://cubic-bezier.com

  2. EaseIn，EaseOut，EaseInOut 使用的rate为常用的2.0，其他靠脑补。。。。（rate越高曲线越陡峭，1.0的时候就是条直线）

  3. 图形取自源码CCTweenFunction.cpp，并在https://www.desmos.com上绘制。