【Cocos2d-X开发学习笔记】第14期:动作类之基本动作的使用(下)

时间:2023-02-08 15:52:03

 本系列学习教程使用的是cocos2d-x-2.1.4(最新版为3.0alpha0-pre) ,PC开发环境Windows7,C++开发环境VS2010

 

 

 我们今天要学习到的基本动作有跳跃动作、贝塞尔曲线动作、淡入淡出动作、闪烁动作、色值渐变动作。

 

一、跳跃动作

 

1、首先看CCJumpTo和CCJumpBy的使用。

 

<1> CCJumpTo::create(float duration,const CCPoint& position,float height,int jumps)

作用:创建一个跳跃的动作。

参数1:跳跃到目标位置所需的时间(秒)。

参数2:目标位置。

参数3:跳的高度。

参数4:跳到目标点所需跳的次数。

 

<2> CCJumpBy::create(float duration,const CCPoint& position,float height,int jumps)

作用:创建一个跳跃的动作。

参数1:跳跃到目标位置所需的时间(秒)。

参数2:目标位置。

参数3:跳的高度。

参数4:跳到目标点所需跳的次数。

CCJumpBy支持reverse()函数,可以获取其反向动作。

 

 2、示例代码如下所示。


首先新建Cocos2D-X项目,然后在HelloWorldScene.cpp文件的init函数中添加如下代码。

bool HelloWorld::init()
{
bool bRet = false;
do
{
CC_BREAK_IF(! CCLayer::init());

//获得尺寸大小
CCSize s = CCDirector::sharedDirector()->getWinSize();

//创建精灵
CCSprite* m_grossini = CCSprite::create("grossini.png");
CCSprite* m_tamara = CCSprite::create("grossinis_sister1.png");
CCSprite* m_kathia = CCSprite::create("grossinis_sister2.png");

//创建跳跃的动作
CCActionInterval* actionTo = CCJumpTo::create(2, ccp(300,300), 50, 4);
CCActionInterval* actionBy = CCJumpBy::create(2, ccp(300,0), 50, 4);
CCActionInterval* actionUp = CCJumpBy::create(2, ccp(0,0), 80, 4);
CCActionInterval* actionByBack = actionBy->reverse();

//为精灵执行动作
m_tamara->runAction( actionTo);
m_grossini->runAction( CCSequence::create(actionBy, actionByBack, NULL));
m_kathia->runAction( CCRepeatForever::create(actionUp));CCActionInterval* actionTo = CCJumpTo::create(2, ccp(300,300), 50, 4);

bRet = true;
} while (0);

return bRet;
}

 

3、跳跃示例效果图。

【Cocos2d-X开发学习笔记】第14期:动作类之基本动作的使用(下)               【Cocos2d-X开发学习笔记】第14期:动作类之基本动作的使用(下)

 

二、贝塞尔曲线动作

 

1、首先看CCBezierTo和CCBezierBy的使用。

<1> CCBezierTo::create(float t,const ccBezierConfig & c)

作用:创建一个贝塞尔曲线运动的动作。

参数1:贝塞尔曲线运动所需的时间(秒)。

参数2:ccBezierConfig结构体。

 

ccBezierConfig结构体如下:

typedef struct _ccBezierConfig {

        CCPoint endPosition;

        CCPoint controlPoint_1;

             CCPoint controlPoint_2;

} ccBezierConfig  

 

其中,各参数的含义如下。

① endPosition:结束点。

② controlPoint_1:控制点1。

③ controlPoint_2:控制点2。

 

<2> CCBezierBy::create(float t,const ccBezierConfig & c)

作用:创建一个贝塞尔曲线运动的动作。

参数1:贝塞尔曲线运动所需的时间(秒)。

参数2:ccBezierConfig结构体。

CCBezierBy支持reverse()函数,可以获取其反向动作。

 

 2、示例代码如下所示。


首先新建Cocos2D-X项目,然后在HelloWorldScene.cpp文件的init函数中添加如下代码。

bool HelloWorld::init()
{
bool bRet = false;
do
{
CC_BREAK_IF(! CCLayer::init());

//获得尺寸大小
CCSize s = CCDirector::sharedDirector()->getWinSize();

//创建精灵
CCSprite* m_grossini = CCSprite::create("grossini.png");
CCSprite* m_tamara = CCSprite::create("grossinis_sister1.png");
CCSprite* m_kathia = CCSprite::create("grossinis_sister2.png");

//设置精灵的位置
m_grossini->setPosition(ccp(s.width/2, s.height/2));
m_tamara->setPosition(ccp(80,160));
m_kathia->setPosition(ccp(400,160));

//添加精灵到图层
addChild(m_grossini, 1);
addChild(m_tamara, 2);
addChild(m_kathia, 3);

//bezier结构体
ccBezierConfig bezier;
bezier.controlPoint_1 = ccp(0, s.height/2);
bezier.controlPoint_2 = ccp(300, -s.height/2);
bezier.endPosition = ccp(300,100);

CCActionInterval* bezierForward = CCBezierBy::create(3, bezier);
CCActionInterval* bezierBack = bezierForward->reverse();
CCAction* rep = CCRepeatForever::create(CCSequence::create( bezierForward, bezierBack, NULL));

//bezier2结构体
ccBezierConfig bezier2;
bezier2.controlPoint_1 = ccp(100, s.height/2);
bezier2.controlPoint_2 = ccp(200, -s.height/2);
bezier2.endPosition = ccp(240,160);

CCActionInterval* bezierTo1 = CCBezierTo::create(2, bezier2);
CCActionInterval* bezierTo2 = CCBezierTo::create(2, bezier2);

m_grossini->runAction(rep);
m_tamara->runAction(bezierTo1);
m_kathia->runAction(bezierTo2);

bRet = true;
} while (0);

return bRet;
}

 


 3、贝塞尔曲线示例效果图。

 【Cocos2d-X开发学习笔记】第14期:动作类之基本动作的使用(下)                   【Cocos2d-X开发学习笔记】第14期:动作类之基本动作的使用(下)

 

 
 

三、淡入淡出动作

 

1、首先看CCFadeIn和CCFadeOut的使用。

 

<1> CCFadeIn::create(float d)

作用:创建一个渐变出现的动作。

参数:渐变所需的时间(秒)。

 

<2> CCFadeOut::create(float d)

作用:创建一个渐变消失的动作。

参数:渐变所需的时间(秒)。

 

2、示例代码如下所示。


首先新建Cocos2D-X项目,然后在HelloWorldScene.cpp文件的init函数中添加如下代码。

bool HelloWorld::init()
{
bool bRet = false;
do
{
CC_BREAK_IF(! CCLayer::init());

//获得尺寸大小
CCSize s = CCDirector::sharedDirector()->getWinSize();

//创建精灵
CCSprite* m_tamara = CCSprite::create("grossinis_sister1.png");
CCSprite* m_kathia = CCSprite::create("grossinis_sister2.png");

//设置精灵的位置
m_kathia->setPosition( ccp(s.width/3, s.height/2));
m_tamara->setPosition( ccp(2*s.width/3, s.height/2));

//添加精灵到图层
addChild(m_tamara, 2);
addChild(m_kathia, 3);

m_tamara->setOpacity( 0 );
CCActionInterval* action1 = CCFadeIn::create(1.0f);
CCActionInterval* action1Back = action1->reverse();

CCActionInterval* action2 = CCFadeOut::create(1.0f);
CCActionInterval* action2Back = action2->reverse();

m_tamara->runAction( CCSequence::create( action1, action1Back, NULL));
m_kathia->runAction( CCSequence::create( action2, action2Back, NULL));

bRet = true;
} while (0);

return bRet;
}


 

 3、淡入淡出的示例效果图。

【Cocos2d-X开发学习笔记】第14期:动作类之基本动作的使用(下)           【Cocos2d-X开发学习笔记】第14期:动作类之基本动作的使用(下)

 

 


四、闪烁动作

 

1、首先看CCBlink的使用。

 

<1> CCBlink::create(float duration,unsigned int uBlinks)

作用:创建一个闪烁的动作。

参数1:闪烁完成所需的时间(秒)。

参数2:闪烁的次数。

 

2、示例代码如下所示。


首先新建Cocos2D-X项目,然后在HelloWorldScene.cpp文件的init函数中添加如下代码。

bool HelloWorld::init()
{
bool bRet = false;
do
{
CC_BREAK_IF(! CCLayer::init());

//获得尺寸大小
CCSize s = CCDirector::sharedDirector()->getWinSize();

//创建精灵
CCSprite* m_tamara = CCSprite::create("grossinis_sister1.png");
CCSprite* m_kathia = CCSprite::create("grossinis_sister2.png");

//设置精灵的位置
m_kathia->setPosition( ccp(s.width/3, s.height/2));
m_tamara->setPosition( ccp(2*s.width/3, s.height/2));

//添加精灵到图层
addChild(m_tamara, 2);
addChild(m_kathia, 3);

CCActionInterval* action1 = CCBlink::create(2, 10);
CCActionInterval* action2 = CCBlink::create(2, 5);

m_tamara->runAction( action1);
m_kathia->runAction(action2);

bRet = true;
} while (0);

return bRet;
}


 

 3、闪烁的示例效果图。

【Cocos2d-X开发学习笔记】第14期:动作类之基本动作的使用(下)

 

 

五、色值渐变动作

 

1、首先看CCTintTo和CCTintBy的使用。

 

<1> CCTintTo::create(float duration,GLubyte red,GLubyte green,GLubyte bule)

作用:创建一个色彩变化的动作。

参数1:色彩变化所需的时间(秒)。

参数2:红色分量。

参数3:绿色分量。

参数4:蓝色分量。

 

<2> CCTintBy::create(float duration,GLubyte red,GLubyte green,GLubyte bule)

作用:创建一个色彩变化的动作。

参数1:色彩变化所需的时间(秒)。

参数2:红色分量。

参数3:绿色分量。

参数4:蓝色分量。

CCTintBy支持reverse()函数,可以获取其反向动作。

 

 

2、示例代码如下所示。


首先新建Cocos2D-X项目,然后在HelloWorldScene.cpp文件的init函数中添加如下代码。

bool HelloWorld::init()
{
bool bRet = false;
do
{
CC_BREAK_IF(! CCLayer::init());

//获得尺寸大小
CCSize s = CCDirector::sharedDirector()->getWinSize();

//创建精灵
CCSprite* m_tamara = CCSprite::create("grossinis_sister1.png");
CCSprite* m_kathia = CCSprite::create("grossinis_sister2.png");

//设置精灵的位置
m_kathia->setPosition( ccp(s.width/3, s.height/2));
m_tamara->setPosition( ccp(2*s.width/3, s.height/2));

//添加精灵到图层
addChild(m_tamara, 2);
addChild(m_kathia, 3);

CCActionInterval* action1 = CCTintTo::create(2, 255, 0, 255);
CCActionInterval* action2 = CCTintBy::create(2, -127, -255, -127);
CCActionInterval* action2Back = action2->reverse();

m_tamara->runAction( action1);
m_kathia->runAction( CCSequence::create( action2, action2Back, NULL));

bRet = true;
} while (0);

return bRet;
}


 

 3、色值渐变的示例效果图。

【Cocos2d-X开发学习笔记】第14期:动作类之基本动作的使用(下)                     【Cocos2d-X开发学习笔记】第14期:动作类之基本动作的使用(下)

 

 

 

源码下载地址