Cocos2d-x CCProgressTimer

CCProgressTimer，創建使用這個節點可以大致實現兩個作用的效果：

其一：在游戲中幾乎大部分的游戲啟動界面都是游戲加載畫面，那么用到的一般是進度條提示加載進度，其使用的就是CCProgressTimer。

其二：在游戲中需要對精靈的出現等動作制作一些漸顯的效果。

 

（1）類型一般就是兩種：

 

typedef enum {
    /// Radial Counter-Clockwise
    kCCProgressTimerTypeRadial,
    /// Bar
    kCCProgressTimerTypeBar,
} CCProgressTimerType;

（2）類型1：radial（環形）

 

 

CCSize wSize = CCDirector::sharedDirector()->getWinSize();
    progressTimer = CCProgressTimer::create(CCSprite::create("progress.gif"));
    progressTimer->setType(kCCProgressTimerTypeRadial);
    // 默認的情況下，環形漸變的方向是：順時針
    // 改變其漸變的方向 Makes the ridial CCW (逆時針)
    progressTimer->setReverseProgress(true);
    progressTimer->setPosition(wSize.width/2,wSize.height/2);
    this->addChild(progressTimer);

 

（3）類型2：bar  （條形：包括vertical 和 horizontal）

漸變的方向問題：

vertical豎直方法包括從上到下和從下到上；

horizontal水平方向包括從左到右和從右到左。

這里涉及到兩個設置參數：

首先是setMidpoint設置起點

 

/**
     *    Midpoint is used to modify the progress start position.
     *    If you're using radials type then the midpoint changes the center point
     *    If you're using bar type the the midpoint changes the bar growth
     *        it expands from the center but clamps to the sprites edge so:
     *        you want a left to right then set the midpoint all the way to ccp(0,y)
     *        you want a right to left then set the midpoint all the way to ccp(1,y)
     *        you want a bottom to top then set the midpoint all the way to ccp(x,0)
     *        you want a top to bottom then set the midpoint all the way to ccp(x,1)
     */

其次是setBarChangeRate設置變化rate

 

 

/**
     *    This allows the bar type to move the component at a specific rate
     *    Set the component to 0 to make sure it stays at 100%.
     *    For example you want a left to right bar but not have the height stay 100%
     *    Set the rate to be ccp(0,1); and set the midpoint to = ccp(0,.5f);
     */

如果不用變化的方向，則設置該方向為0，否則設置為1。

 

 

CCSize wSize = CCDirector::sharedDirector()->getWinSize();
    progressTimer = CCProgressTimer::create(CCSprite::create("progress.gif"));
    progressTimer->setType(kCCProgressTimerTypeBar);

    //從左到右
    progressTimer->setMidpoint(ccp(0, 0.5));
    progressTimer->setBarChangeRate(ccp(1, 0));

    //從右到左
//    progressTimer->setMidpoint(ccp(1, 0.5));
//    progressTimer->setBarChangeRate(ccp(1, 0));

    //從上到下
//    progressTimer->setMidpoint(ccp(0.5, 1));
//    progressTimer->setBarChangeRate(ccp(0, 1));

    //從下到上
//    progressTimer->setMidpoint(ccp(0.5, 0));
//    progressTimer->setBarChangeRate(ccp(0, 1));

    progressTimer->setPosition(wSize.width/2,wSize.height/2);
    this->addChild(progressTimer);

(4) 執行變化

 

①、如果是要實現精靈漸變的顯示效果：

創建CCProgressTo或者是CCProgressFromTo動作，讓CCProgressTimer執行。
CCProgressTo和CCProgressFromTo的區別是：

前者：Progress to percentage（初始化有兩個參數）(float duration, float fPercent)

后者：Progress from a percentage to another percentage（初始化有三個參數）(float duration, float fFromPercentage, float fToPercentage)

 

CCProgressTo *progressTo = CCProgressTo::create(2.0, 100);
    //等價於：
    //CCProgressFromTo *progressFromTo = CCProgressFromTo::create(2.0, 0, 100);
    progressTimer->runAction(CCRepeatForever::create(progressTo));

②、如果是要實現加載進度條的效果：

 

需要重載update方法，在這個方法中實現進度條percentage的變化。

 

this->scheduleUpdate();

 

void HelloWorld::update(float dt)
{
    float percentage = progressTimer->getPercentage();

    if (percentage < 100) {
        percentage += 1;
        progressTimer->setPercentage(percentage);
    }
}

 

 

關於CCProgressTimer的更加詳細的使用 demo可以參看引擎中sample中的ActionProgressTest。