倒计时颜色渐变动画效果

先准备相同大小的红、黄、绿三色图片各一张，实现围绕头像倒计时颜色渐变效果：

    CCSize s = CCDirector::sharedDirector()->getWinSize();



    change = 0;


　　//头像

    CCSprite *ava = CCSprite::create("girl.jpg");


　　//默认绿色计时条

    CCProgressTimer *left = CCProgressTimer::create(CCSprite::create("b5s.png"));

    left->setType( kCCProgressTimerTypeRadial );
　　//顺时针

    left->setReverseDirection(true);
　　//进度条百分比

    left->setPercentage(100);

    ava->setPosition(ccp(100, s.height/2));

    di->setPosition(ccp(100, s.height/2));

    addChild(di);

    addChild(ava);

    addChild(left, 0, 200);

    left->setPosition(ccp(100, s.height/2));
　　//增加每秒状态更新函数

    this->schedule(schedule_selector(HelloWorld::update), 1.0);

　　//15秒倒计时，状态条从100变0

    CCProgressFromTo *from = CCProgressFromTo::create(15, 100, 0);

    left->runAction(CCRepeatForever::create(from));

 

void HelloWorld::update(float dt)

{

    CCProgressTimer *left = ((CCProgressTimer*)this->getChildByTag(200));

    if ((left->getPercentage() > 67) && (left->getPercentage() < 100) && (0 == change))

    {

        left->setSprite(CCSprite::create("b5s.png"));

        change = 1;

    }

    if ((left->getPercentage() > 33) && (left->getPercentage() < 67) && (1 == change))

    {

        left->setSprite(CCSprite::create("m5s.png"));

        change = 2;

    }

    if ((left->getPercentage() > 0) && (left->getPercentage() < 33) && (2 == change))

    {

        left->setSprite(CCSprite::create("a5s.png"));

        change = 0;

    }



    if(left->getPercentage() == 0)

    {

        left->setPercentage(100);

        change = 0;

    }

}

 

下面看下效果：