cocos2dx游戏--欢欢英雄传说--添加血条

用一个空血槽图片的Sprite做背景，上面放一个ProgressTimer, 通过设置ProgressTimer的进度来控制血条的长短。建立一个Progress类来实现。
Progress.h:

#ifndef __Progress__
#define __Progress__
#include "cocos2d.h"
USING_NS_CC;

class Progress : public Sprite
{
public:
    bool init(const char* background, const char* fillname);
    /*
    the inputs are SpriteFrame Names.
    they should be loaded into SpriteFrameCache before calling this.
    */
    static Progress* create(const char* background, const char* fill);

    void setFill(ProgressTimer* fill){_fill=fill;}

    void setProgress(float percentage){_fill->setPercentage(percentage);}

private:
    ProgressTimer* _fill;
};
#endif

Progress.cpp:

#include "Progress.h"

bool Progress::init(const char* background, const char* fillname)
{
    this->initWithSpriteFrameName(background);
    ProgressTimer* fill = ProgressTimer::create(Sprite::createWithSpriteFrameName(fillname));
    this->setFill(fill);
    this->addChild(fill);

    fill->setType(ProgressTimer::Type::BAR);
    fill->setMidpoint(Point(0,0.5));
    fill->setBarChangeRate(Point(1.0, 0));
    fill->setPosition(this->getContentSize()/2);
    fill->setPercentage(100);
    return true;
}

Progress* Progress::create(const char* background, const char* fillname)
{
    Progress* progress = new Progress();
    if(progress && progress->init(background,fillname))
    {
        progress->autorelease();
        return progress;
    }
    else
    {
        delete progress;
        progress = NULL;
        return NULL;
    }
}

init函数需要传入两个SpriteFrameName，所以UI资源需要在MainScene::init()函数中提前载入：

SpriteFrameCache::getInstance()->addSpriteFramesWithFile("images/ui.plist","images/ui.pvr.ccz");

MainScene中需要添加一个Progress*类型的对象_progress：

Progress* _progress;

代码中设置了ProgressTimer的参数，值得注意的有：
setType：设置类型为ProgressTimer::Type::BAR，血条自然是条状类的。
setMidpoint：设置血条的起点为(0,0.5)，即左侧的中间点。
setBarChangeRate：设置变化率为(1,0)，即在x轴变化率为1，y轴不变化。
setPercentage：设置血条填充率为100，即满血状态。
然后在MainScene::init()函数中添加：

    _progress = Progress::create("player-progress-bg.png","player-progress-fill.png");
    _progress->setPosition(_progress->getContentSize().width/2, this->getContentSize().height - _progress->getContentSize().height/2);
    this->addChild(_progress);

然后就会在窗口的左下角出现英雄的血条。效果如下：

 接下来要给敌人添加血条。可以在Player中添加，但是这么做的话默认也给玩家添加了血条（敌人的血条是随着敌人的运动而运动的）。一种解决办法是隐藏英雄的血条。
在Player中增加私有变量_progress，并在init中进行初始化，增加bool型变量_isShowBar 用来通过角色类型判断是否显示。
Player::init中添加：

auto size = this->getContentSize();
_progress = Progress::create("small-enemy-progress-bg.png","small-enemy-progress-fill.png");
_progress->setPosition( size.width*2/3, size.height + _progress->getContentSize().height/2);
this->addChild(_progress);
if(!_isShowBar)
{
    _progress->setVisible(false);
}

运行程序便可以看到玩家和敌人的血条都显示了。