【玩转cocos2d-x之十四】菜单选项卡的实现

原创作品，转载请标明：http://blog.csdn.net/jackystudio/article/details/12940733

有时候，我们希望实现一个选项卡功能，就是切换tab选项，场景中的内容会跟着改变，但是tab选项卡不动。这是用切换场景的方式没办法做到的。

这里我们就可以使用CCLayerMultiplex来实现这个功能。

1.创建布景

这里创建3个布景来做示范。分别是Laye1，Layer2和Layer3。代码就不贴了，布景内容可以直接使用HelloWorld的代码。

2.创建主场景

主场景的初始化函数如下：

[cpp] view plain copy

1. boolCCMainScene::init()
2. {
3. boolbRet=false;
4. do
5. {
6. CC_BREAK_IF(!CCScene::init());
8. _layer1=CCLayer1::create();//创建3个层的实例
9. _layer2=CCLayer2::create();
10. _layer3=CCLayer3::create();
12. _layerMuticomplex=CCLayerMultiplex::create(_layer1,_layer2,_layer3,NULL);//创建多层布景层
13. this->addChild(_layerMuticomplex);//添加到场景，默认显示第一个布景
15. CCSizevisibleSize=CCDirector::sharedDirector()->getVisibleSize();
16. CCPointorigin=CCDirector::sharedDirector()->getVisibleOrigin();
18. CCMenuItemImage*pCloseItem1=CCMenuItemImage::create(//创建3个tab菜单，用于切换布景
19. "w_b.png",
20. "w_b.png",
21. this,
22. menu_selector(CCMainScene::menuCallback));
24. CCMenuItemImage*pCloseItem2=CCMenuItemImage::create(
25. "r_b.png",
26. "r_b.png",
27. this,
28. menu_selector(CCMainScene::menuCallback));
30. CCMenuItemImage*pCloseItem3=CCMenuItemImage::create(
31. "g_b.png",
32. "g_b.png",
33. this,
34. menu_selector(CCMainScene::menuCallback));
36. //createmenu,it'sanautoreleaseobject
37. pCloseItem1->setTag(0);//给tab按钮设置tag，方便回调函数中的获取
38. pCloseItem2->setTag(1);
39. pCloseItem3->setTag(2);
40. CCMenu*pMenu=CCMenu::create(pCloseItem1,pCloseItem2,pCloseItem3,NULL);//创建菜单
41. pMenu->alignItemsHorizontallyWithPadding(-1);//设置菜单项间隔
42. pMenu->setPosition(visibleSize.width/2,25);
43. this->addChild(pMenu,1);//注意哦，菜单要在场景中添加而不是在布景中了！而且z轴要高于多层布景，保证可见。
44. bRet=true;
45. }while(0);
46. returnbRet;
47. }

回调函数如下：

[cpp] view plain copy

1. voidCCMainScene::menuCallback(CCObject*pSender)
2. {
3. intitem=((CCMenuItemImage*)pSender)->getTag();//获取选择项
4. if(item!=curLayerPos)
5. {
6. _layerMuticomplex->switchTo(item);//切换布景，如果使用switchToAndReleaseMe会释放掉当前布景
7. curLayerPos=item;
8. }
9. }

3.效果

为了让效果明显一点，我让3个布景稍微有点区别。当然菜单是可以做normal，pressed，disable三态的，这里略去。点击不同的选项卡就可以切换到不同的布景层。当然CCLayerMultiplex还可以嵌套使用。

4.源码下载地址

http://download.csdn.net/detail/jackyvincefu/6421801