cocos2d-x 如何使用CCProgressTimer作为血条,实现跟随怪物进行移动,自动掉血,然后死亡。

Cocos2d-x中类CCProgressTimer实现游戏人物血条


一、CCProgressTimer的基本使用步骤:

cocos2d-x的进度条函数CCProgressTimer,我们可以这样定义:

1. //s_pPathSister1为图片的路径
2. CCProgressTimer *left = CCProgressTimer::create(CCSprite::create(s_pPathSister1));

然后我们设置进度条的属性1:

1. //kCCProgressTimerTypeBar为进度条的形式
2. left->setType(kCCProgressTimerTypeBar);

cocos2d-x封装了2中显示方式:

条形:kCCProgressTimerTypeBar

圆弧形:kCCProgressTimerTypeRadial

属性2:

1. setMidpoint();

对圆弧来说,就是设置中心点,但对条形来说,它是设置进度条的起始点,(0,y)表示最左边,(1,y)表示最右边,(x,1)表示最上面,(x,0)表示最下面。

属性3:

 

1. setBarChangeRate();

用来设置进度条动画方向的,(1,0)表示横方向,(0,1)表示纵方向。

还有最重要的一个方法:

 

1. setPercentage();

用来设置进度条的当前进度,(100.0f)表示满值。

 

二、使用CCProgressTimer实现游戏人物血条:

01. //角色血条(空血框)
02. CCSprite *pBloodKongSp = CCSprite::create("bloodKong.png");
03. pBloodKongSp->setPosition(ccp(sizeSp.width/2, sizeSp.height+10));
04. //绑到人物精灵上
05. pSprite->addChild(pBloodKongSp);
06. //满血条
07. CCSprite *pBloodManSp = CCSprite::create("bloodMan.png");
08. //创建用于表示人物当前血量的进度条
09. CCProgressTimer *pBloodProGress = CCProgressTimer::create(pBloodManSp);
10. //设置为条形
11. pBloodProGress->setType(kCCProgressTimerTypeBar);
12. //设置起始点为条形左下方
13. pBloodProGress->setMidpoint(ccp(0,0));
14. //设置为水平方向
15. pBloodProGress->setBarChangeRate(ccp(1, 0));
16. //设置初始进度为满血
17. pBloodProGress->setPercentage(100.0f);
18. //设置位置,与上面的空血框重叠,且居于其上
19. pBloodProGress->setPosition(ccp(sizeSp.width/2, sizeSp.height+10));
20. //绑到人物精灵上,并设置tag值,一遍之后获取进度条,并通过setPercentage改变当前血量
21. pSprite->addChild(pBloodProGress, 1, 1);

 

实现原理其实很简单,就是一个用满的血条创建的进度条覆盖在一个用空的血框创建的精灵上,并通过进度条的setPercentage方法改变它自身的显示区域,当进度小于100%时,位于进度条底下的血框就被显示出了一部分,从而达到游戏中,我们常见的血条的效果。



1、如何使用CCProgressTimer  2、如何跟随怪物  3、如何掉血和死亡  4、结构层次。

 //注意加红色部分


样例代码如下:


怪物的定义:

class Enemy :
public CCSprite
{
public:
    Enemy(CCPoint p, CCString* type, int itemId);
~Enemy(void);


    CCSprite* enemySprite;


怪物放入layer进行显示:

        gameLayer->addChild(this->enemySprite,KZENEMY);


血条在创建enemy时一并创建,并作为其子:

        Enemy* enemy = new Enemy(startPosition,enemytype, ((int)(dt*1000))%30);
        //加入血条背景
        CCProgressTimer* progressTimeHPBackGround = CCProgressTimer::create(CCSprite::create("hpbackground.png"));
        progressTimeHPBackGround->setPosition(ccp(0,32));
        progressTimeHPBackGround->setAnchorPoint(ccp(0,0));
        progressTimeHPBackGround->setPercentage(100);


        //加入血条背景
        CCProgressTimer* progressTimeHP = CCProgressTimer::create(CCSprite::create("hp.png"));
        progressTimeHP->setPosition(ccp(0,sGlobal->tileBlockSize));//下面的配置参加testcpp的样例代码
        progressTimeHP->setAnchorPoint(ccp(0,0));  //默认是中间,要设置左下角
        progressTimeHP->setPercentage(100);  //初始的百分比
        progressTimeHP->setMidpoint(ccp(0, 1));  //设置中点位置,默认是四周向重点变化。现在把重点设置为左边(纵向居中),使血从右向左减少
        progressTimeHP->setBarChangeRate(ccp(1, 0));//暂时不知道什么用
        progressTimeHP->setType(kCCProgressTimerTypeBar);//暂时不知道什么用

        enemy->enemySprite->addChild(progressTimeHPBackGround,KZENEMY);                     
        enemy->enemySprite->addChild(progressTimeHP,KZENEMYHP,TENEMYHP);


跟随移动、掉血和死亡:

            pEnemy->enemySprite->setPosition(nextP);
            CCProgressTimer* cct = (CCProgressTimer*)pEnemy->enemySprite->getChildByTag(TENEMYHP);
            int cp = cct->getPercentage();
            if (cp > 0)
            {
                cct->setPercentage(--cp); //掉血
            }
            else
            {
                pEnemy->enemySprite->setVisible(false);//设置不可见
                finishedEnemy->addObject(pEnemy);   //放入死亡数组,等待delete内存
            }
        

效果图:

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值