cocos2d-x 3.X用progressTimer制作血槽

时间:2023-02-08 15:47:28

http://www.2cto.com/kf/201403/289326.html


血条经常会用到,没必要重复编写浪费时间,这里用最新版的API写个,方便以后调用。

以下代码使用的引擎版本是cocos2d-x 3.0rc0

1.RADIAL

cocos2d-x 3.X用progressTimer制作血槽

Sprite *bgSprite = Sprite::create( "red.png" );
     addChild(bgSprite, 1 , 1 );
 
     Sprite *hpSprite = Sprite::create( "green.png" );
 
     progressTimer = ProgressTimer::create(hpSprite);
     
   //设置进度条的模式
   //kCCProgressTimerTypeBar表示条形模式
   //默认的模式是kCCProgressTimerTypeRadial(圆圈模式)
     progressTimer->setType(ProgressTimer::Type::RADIAL);
     progressTimer->setReverseProgress( true );
     progressTimer->setPercentage( 30 ); //满值 100%
 
     addChild(progressTimer, 0 , 0 );

2.BAR

cocos2d-x 3.X用progressTimer制作血槽

Sprite *bgSprite = Sprite::create( "box.png" );
     addChild(bgSprite, 1 , 1 );
 
     Sprite *hpSprite = Sprite::create( "hp.png" );
 
     progressTimer = ProgressTimer::create(hpSprite);
 
     progressTimer->setType(ProgressTimer::Type::BAR);
 
     ///////////////////////////////////////////////////////////////////////////////////////////////////////
     //从左到右
     progressTimer->setMidpoint(ccp( 0 , 0.5 ));
     progressTimer->setBarChangeRate(ccp( 1 , 0 ));
 
   //设置进度条变化的方向
   //setMidpoint默认在左边
   //ccp(1,0)表示在X轴方向上有变化,在y轴方向上没变化
   //ccp(0,1)表示在X轴方向上没有变化,在y轴方向上有变化

     //从右到左
     //    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->setMidpoint(Point( 0 , 0.5 ));
     progressTimer->setBarChangeRate(Point( 1 , 0 ));
 
     progressTimer->setPercentage( 30 ); //满值 100%
 
     addChild(progressTimer, 0 , 0 );