[Cocos2d-x] loading加载动画

相信大家在玩游戏的过程中都会遇到一个loading的界面，loading界面的作用主要是为了加载游戏中需要用到的资源。在比较大型的游戏中，资源通常会占用很大的空间，如果不做一个预加载，在切换界面的过程中很容易造成卡屏的现象。

下面先给出运行效果。

今天要讲解的内容便是加载界面中的进度条控件的使用方法，在这里我们只学习控件的使用，不讲解加载过程的逻辑处理。

所谓的进度条，其实不过是两张纹理的组合，其中一个纹理全部显示出来，而另一个纹理会随着加载的过程有一定的变化，我们可以为它设置一个动作，也可以直接设置它显示的百分比，首先我们来看一下两张图片 ：

 

这就是未加载时和加载完成后的进度条显示，加载完成后，第二个纹理完全遮住了第一个纹理，但事实上他们是两个纹理。

先给出实现代码。

1. .h文件中声明全局变量。

        CCSprite * loadBkSpr; 
       
 
        CCProgressTimer * loadBar;//进度条 
       
 
        CCSprite *loadSprite;     //加载奔跑萝莉 

2. .cpp文件中实现loading效果。

         bool GameMain::init() 
        
 
         { 
        
 
             if( !CCLayer::init() ) { 
        
 
                   
        
 
                 returnfalse; 
        
 
             } 
        
 
               
        
 
             CCSize size = CCDirector::sharedDirector()->getWinSize(); 
        
 
             //返回 
        
 
             CCMenuItemImage *back = CCMenuItemImage::create("backA.png","backB.png",this,menu_selector(GameMain::menuBackCallback)); 
        
 
             if(size.height > 500) 
        
 
             { 
        
 
                 back->setScale(2.0f); 
        
 
             } 
        
 
             back->setPosition(ccp(size.width - 60,size.height - 60)); 
        
 
             back->setEnabled(false); 
        
 
             CCMenu* mainmenu = CCMenu::create(back,NULL); 
        
 
             mainmenu->setPosition(ccp(0,0)); 
        
 
             this->addChild(mainmenu,3,4); 
        
 
               
        
 
               
        
 
             //加载效果  1.进度条   2.奔跑小人 
        
 
             //1.进度条 
        
 
             loadBkSpr=CCSprite::create("loading_1_1.png");//加载进度条的边框精灵 
        
 
             loadBkSpr->setPosition(ccp(size.width/2,size.height/2+size.height/4)); 
        
 
             loadBkSpr->setScale(3.0f); 
        
 
             this->addChild(loadBkSpr); 
        
 
             loadBar=CCProgressTimer::create(CCSprite::create("loading_1_2.png")); 
        
 
             loadBar->setPercentage(1.0f);//设置百分比,初始为0 
        
 
             loadBar->setPosition(ccp(size.width/2,size.height/2+size.height/4)); 
        
 
             loadBar->setType(kCCProgressTimerTypeBar);//设置进度条为水平类型 
        
 
             loadBar->setBarChangeRate(ccp(1,0));//设置进度条的宽高变化，此处为宽度变化 
        
 
             loadBar->setMidpoint(ccp(0, 0));//设置动画运动方向从左至右 
        
 
             loadBar->setScale(3.0f); 
        
 
             this->addChild(loadBar); 
        
 
             //设置一个动作，令进度条10秒内读取到百分之100 
        
 
             CCProgressTo * action= CCProgressTo::create(4, 100); 
        
 
             //加载完毕.移除加载动画,进入游戏场景 
        
 
             loadBar->runAction(CCSequence::create(action,CCCallFunc::create(this, callfunc_selector(GameMain::loadSuccess)),NULL)); 
        
 
             //2.奔跑小人 
        
 
             loadSprite = CCSprite::create("s_1.png"); 
        
 
             CCAnimation * animation = CCAnimation::create(); 
        
 
             animation->addSpriteFrameWithFileName("s_1.png"); 
        
 
             animation->addSpriteFrameWithFileName("s_2.png"); 
        
 
             animation->addSpriteFrameWithFileName("s_3.png"); 
        
 
             animation->addSpriteFrameWithFileName("s_4.png"); 
        
 
             animation->addSpriteFrameWithFileName("s_5.png"); 
        
 
             animation->addSpriteFrameWithFileName("s_6.png"); 
        
 
             animation->setDelayPerUnit(0.1f); 
        
 
             animation->setRestoreOriginalFrame(true); 
        
 
             loadSprite->setPosition(ccp(100, size.height/4)); 
        
 
             //运行奔跑动画 
        
 
             loadSprite->runAction(CCRepeatForever::create(CCAnimate::create(animation))); 
        
 
             CCMoveTo *moveTo = CCMoveTo::create(4, ccp(1000, size.height/4)); 
        
 
             loadSprite->runAction(moveTo); 
        
 
             this->addChild(loadSprite); 
        
 
               
        
 
             returntrue; 
        
 
               
        
 
         } 
        
 
           
        
 
           
        
 
         //加载完毕.移除加载动画,进入游戏场景, 
        
 
         void GameMain::loadSuccess() 
        
 
         { 
        
 
             loadBar->removeFromParent(); 
        
 
             loadBkSpr->removeFromParent(); 
        
 
             loadSprite->removeFromParent(); 
        
 
         } 

我们所展示的进度条只不过是一个假的进度条，因为它并不是随着资源加载的百分比而变化的，事实上我们可以设置一个回调函数，在资源加载的过程中调用，并随着加载进度设置进度条的百分比,例如：

CCTextureCache::sharedTextureCache()->addImageAsync("HelloWorld.png”,this,callfuncO_selector(newScene::loadCallBack)); 

此处就不过多讲解了。