效果展示：

步骤如下：

1、创建label和progressTimer；

2、加载资源

首先看下头文件：HelloWorld.h

#ifndef __HELLOWORLD_SCENE_H__
#define __HELLOWORLD_SCENE_H__

#include "cocos2d.h"
using namespace cocos2d;
class HelloWorld : public cocos2d::Layer
{
public:
    // there's no 'id' in cpp,so we recommend returning the class instance pointer
    static cocos2d::Scene* createScene();

    // Here's a difference. Method 'init' in cocos2d-x returns bool,instead of returning 'id' in cocos2d-iphone
    virtual bool init();
    
    // a selector callback
    void menuCloseCallback(cocos2d::Ref* pSender);
    
    // implement the "static create()" method manually
    CREATE_FUNC(HelloWorld);
    
    void loadingCallback(Ref *pSender);
    
private:
    //进度条
    ProgressTimer *timer;
    
    int totolImage;//总图片
    int loadImage;//加载图片的总数：
    Label* percentLabel;//加载进度label
    Label* loadLabel;//显示 loading: 的label
};

#endif // __HELLOWORLD_SCENE_H__

bool HelloWorld::init()
{
    //////////////////////////////
    // 1. super init first
    if ( !Layer::init() )
    {
        return false;
    }
    
    Size visibleSize = Director::getInstance()->getVisibleSize();
    Vec2 origin = Director::getInstance()->getVisibleOrigin();

    //创建显示Loading: 的label
    loadLabel = Label::create("Loading:","Arial",30);
    loadLabel->setPosition(Point(visibleSize.width/2-30,visibleSize.height/2+30));
    this->addChild(loadLabel,1);
    //创建显示百分比的label
    percentLabel = Label::create("0%",30);
    percentLabel->setPosition(Point(visibleSize.width/2+35,visibleSize.height/2+30));
    this->addChild(percentLabel,2);
    
    //设置固定的滑动条上面的精灵：
    Sprite *down = Sprite::create("down.png");
    down->setScale(2,2);
    down->setPosition(Vec2(visibleSize.width/2,visibleSize.height/2-55));
    this->addChild(down);
    
    
    totolImage = 500;
    
    //初始化进度条，底纹为grass.png
    timer = ProgressTimer::create(Sprite::create("grass.png"));
    timer->setType(cocos2d::ProgressTimer::Type::BAR);//设置进度条为条形类型
    timer->setMidpoint(Vec2(0,1));//设置运动方向
    timer->setBarChangeRate(Vec2(1,0));//设置进度条的变化速率
    timer->setPercentage(0.0f);//设置进度条的初始百分比为0
    timer->setScale(2);
    timer->setPosition(Vec2(visibleSize.width/2,visibleSize.height/2));//设置进度条的位置
    this->addChild(timer);

 //这里我们加载500张的重复图片，这时候季度条会读取慢一点，有利于我们观察：
    for(int i = 1;i<=500;i++){
        Director::getInstance()->getTextureCache()->addImageAsync("HelloWorld.png",CC_CALLBACK_1(HelloWorld::loadingCallback,this));
    }
    

    return true;
}

3.图片加载中的回调函数：

void HelloWorld::loadingCallback(Ref *pSender){
    
     Size visibleSize = Director::getInstance()->getVisibleSize();
    //每进到这个函数一次，让m_loadedSp + 1
    loadImage++;
    
    //进度条当前的百分比
    float newPercent = 100 - ((float)totolImage - (float)loadImage)/((float)totolImage/100);

    //或者ProgressFromTo这种动作来更新进度条
    timer->setPercentage(newPercent);//更新进度条
    
    
    //更定loadLabel的数值
    char buf_str[16];
    sprintf(buf_str,"       %d%%",(int)(((float)loadImage / totolImage) * 100));
    percentLabel->setString(buf_str);//更新percentLabel的值
    //图片加载完成后
    if(loadImage == totolImage)
    {
        //如果你想在进度结束的时候，进入下一个页面，那么你可以移除以下的label和进度条：
        //这样有利于内存的利用。
        
//        this->removeChild(timer);
//        this->removeChild(percentLabel);
//        this->removeChild(loadLabel);
        
        //加载完成后显示开始游戏
        MenuItemImage *image = MenuItemImage::create("kaishi.png","kashi1.png");
        image->setPosition(Vec2(visibleSize.width/2,visibleSize.height/2-60));
        image->setScale(2,2);
        this->addChild(image);
    }
}