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

 本系列学习教程使用的是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、跳跃示例效果图。

               

 

二、贝塞尔曲线动作

 

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、贝塞尔曲线示例效果图。

                    

 

 
 

三、淡入淡出动作

 

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、淡入淡出的示例效果图。

           

 

 

四、闪烁动作

 

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、闪烁的示例效果图。

 

 

五、色值渐变动作

 

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、色值渐变的示例效果图。

                     

 

 

 

源码下载地址