相信大家在玩游戏的过程中都会遇到一个loading的界面,loading界面的作用主要是为了加载游戏中需要用到的资源。在比较大型的游戏中,资源通常会占用很大的空间,如果不做一个预加载,在切换界面的过程中很容易造成卡屏的现象。
下面先给出运行效果。
今天要讲解的内容便是加载界面中的进度条控件的使用方法,在这里我们只学习控件的使用,不讲解加载过程的逻辑处理。
所谓的进度条,其实不过是两张纹理的组合,其中一个纹理全部显示出来,而另一个纹理会随着加载的过程有一定的变化,我们可以为它设置一个动作,也可以直接设置它显示的百分比,首先我们来看一下两张图片 :
这就是未加载时和加载完成后的进度条显示,加载完成后,第二个纹理完全遮住了第一个纹理,但事实上他们是两个纹理。
先给出实现代码。
1. .h文件中声明全局变量。
1
2
3
|
CCSprite * loadBkSpr;
CCProgressTimer * loadBar; //进度条
CCSprite *loadSprite; //加载奔跑萝莉
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
|
bool GameMain::init()
{
if ( !CCLayer::init() ) {
return false ;
}
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);
return true ;
}
//加载完毕.移除加载动画,进入游戏场景,
void GameMain::loadSuccess()
{
loadBar->removeFromParent();
loadBkSpr->removeFromParent();
loadSprite->removeFromParent();
}
|
我们所展示的进度条只不过是一个假的进度条,因为它并不是随着资源加载的百分比而变化的,事实上我们可以设置一个回调函数,在资源加载的过程中调用,并随着加载进度设置进度条的百分比,例如:
CCTextureCache::sharedTextureCache()->addImageAsync("HelloWorld.png”,this,callfuncO_selector(newScene::loadCallBack));
此处就不过多讲解了。