动作-CCActionInterval之CCActionEase家族

时间:2022-09-24 16:03:56

补间动作也是一个包装器(之前叫补间动画,从字面上讲,叫动作更合适一些。)。你也可以叫他缓释动作。

1.含义

补间动作改变的是,内部动作的执行速率(注意,并没有改变执行的最终效果,和执行的时间。)关于这个含义,我们用图表表示,横轴表示时间,纵轴表示位移。

动作-CCActionInterval之CCActionEase家族

假设我们有一个动作,4秒内按(100,100)的增量进行移动

1. CCMoveBy::actionWithDuration(4.0f, ccp(100,100));

假设我们的机器比较操蛋,一秒一帧(用绿线切割)。假设初始节点在(0,0)点,那么这四秒移动的点位置分别是(25,25)(50,50)(75,75)(100,100)。

他的位移时间关系就是图上的蓝线,从图上可以清晰看出,移动是按照匀速速率进行的。

现在我们使用CCEaseSineInOut做包装器,包装这个动作:

1. CCEaseSineOut::actionWithAction(CCMoveBy::actionWithDuration(4.0f, ccp(100,100)));

他的位移时间关系变成图上的红线,从图上可以清晰看出,移动是非匀速速率进行的,先慢后快。那么被绿线截取的位移点的位置,也会发生变化。

从这个图可以看出,使用补间动作,并没有改变位移和时间,但是改变了动作的执行速率,从匀速执行变为非匀速执行。

2.原理

通过包装器,每一个补间动画,都改变了内部动作的执行速率,这是通过封装代理update函数完成的,例如前面的CCEaseSineOut。

1. void CCEaseSineOut::update(ccTime time) {

2.             m_pOther->update(sinf(time * (float)M_PI_2));

3. }

3.后缀解释

补间动作有三种后缀:

In:表示动作执行先快后慢

Out:表示动作执行先慢后快

InOut:表示动作执行快-慢-快

第二部分:使用补间动作

不同的补间动画有不同的ST图。可以在这里查看和运行效果

http://www.robertpenner.com/easing/easing_demo.html

你可能觉得这种执行方式很奇怪。但这样可以做出很不错的效果,比你自己手动调整要快的多,因为这些曲线都是来自于数学计算,而这些数学公式,都是从实际的物体运行中总结出来的。

使用举例:比如你要做一个皮球落地的动作,就可以用CCEaseBounceOut。具体效果你可以用上面的地址运行一下。

第三部分:CCSpeed

CCSpeed也是一个包装器,区别于补间动作,他是真正可以改变内部动作执行时间(Duration)的。

1. CCActionInterval *move = CCMoveBy::actionWithDuration(3,ccp(350,0));

2. CCSpeed *speed= CCSpeed::actionWithAction(move,2.0f);   // 调整为2倍速运行

v\:* {behavior:url(#default#VML);}
o\:* {behavior:url(#default#VML);}
w\:* {behavior:url(#default#VML);}
.shape {behavior:url(#default#VML);}

Normal
0
false

10 pt
0
2

false
false
false

EN-US
ZH-CN
X-NONE

$([{£¥·‘“〈《「『【〔〖〝﹙﹛﹝$(.[{£¥
!%),.:;>?]}¢¨°·ˇˉ―‖’”…‰′″›℃∶、。〃〉》」』】〕〗〞︶︺︾﹀﹄﹚﹜﹞!"%'),.:;?]`|}~¢

/* Style Definitions */
table.MsoNormalTable
{mso-style-name:普通表格;
mso-tstyle-rowband-size:0;
mso-tstyle-colband-size:0;
mso-style-noshow:yes;
mso-style-priority:99;
mso-style-parent:"";
mso-padding-alt:0cm 5.4pt 0cm 5.4pt;
mso-para-margin:0cm;
mso-para-margin-bottom:.0001pt;
mso-pagination:widow-orphan;
font-size:12.0pt;
font-family:Cambria;
mso-ascii-font-family:Cambria;
mso-ascii-theme-font:minor-latin;
mso-hansi-font-family:Cambria;
mso-hansi-theme-font:minor-latin;
mso-font-kerning:1.0pt;}


使用举例:这个动作经常用来做慢镜头和快进。