cocos2d-x 3.0學習-創建菜單場景

一、創建菜單場景

我們在一個遊戲中，通常打開遊戲後都會有一個菜單場景，在菜單場景中你可以點擊開始按鈕，也可以點擊其它例如設置等按鈕。這是一個非常通用的場景，今天就來嘗試創建一個menu的場景。

二、簡單的例子 - hello Menu Scene

首先創建一個場景類:

MenuScene.h

1. #ifndef __MENU_SCENE_H__
2. #define __MENU_SCENE_H__
3.  
4.  
5. #include "cocos2d.h"
6.  
7. using namespace cocos2d;
8.  
9. class MenuScene:public Scene{
10. public:
11. MenuScene();
12. ~MenuScene();
13. virtual bool init();
14. CREATE_FUNC(MenuScene);
15.  
16. };
17. #endif

MenuScene.cpp

1. #include "MenuScene.h"
2. #include "MenuLayer.h"
3. #include "BackgroundLayer.h"
4.  
5. MenuScene::MenuScene(){};
6. MenuScene::~MenuScene(){};
7.  
8. bool MenuScene::init(){
9. if(!Scene::init()){
10. return false;
11. }
12.  
13. auto bgLayer = BackgroundLayer::create();
14. if(bgLayer){
15. this->addChild(bgLayer);
16. }
17.  
18. auto menuLayer = MenuLayer::create();
19. if(menuLayer){
20. this->addChild(menuLayer);
21. }
22.  
23. return true;
24. }

可以看到在實現類中，我們在Scene中添加了兩個層，一個是背景層，一個是菜單層。背景層就不說了，和創建普通層沒什麼區別，只是在層中添加一個背景圖而已。下面看下菜單層： MenuLayer.h

1. #ifndef __MENU_LAYER_H__
2. #define __MENU_LAYER_H__
3.  
4. #include "cocos2d.h"
5.  
6. using namespace cocos2d;
7.  
8. class MenuLayer:public Layer{
9. public:
10. virtual bool init();
11. CREATE_FUNC(MenuLayer);
12. void menuStartCallback(Object *sender);
13.  
14. };
15. #endif

MenuLayer.cpp

1. #include "MenuLayer.h"
2. #include "GameScene.h"
3.  
4. bool MenuLayer::init(){
5. if(!Layer::init()){
6. return false;
7. }
8. Point origin = Director::getInstance()->getVisibleOrigin();
9. Size visiableSize = Director::getInstance()->getVisibleSize();
10. SpriteFrame *playBtnFrmae = SpriteFrameCache::getInstance()->getSpriteFrameByName("play_btn.png");
11. auto playBtn = Sprite::createWithSpriteFrame(playBtnFrmae);
12. auto activePlayBtn = Sprite::createWithSpriteFrame(playBtnFrmae);
13. activePlayBtn->setPositionY(7);
14. auto menuItem = MenuItemSprite::create(playBtn,activePlayBtn,NULL,CC_CALLBACK_1(MenuLayer::menuStartCallback, this));
15. menuItem->setPosition(Point(origin.x + visiableSize.width/2 ,origin.y + visiableSize.height*2/5));
16.  
17. auto menu = Menu::create(menuItem,NULL);
18. menu->setPosition(Point(origin.x ,origin.y));
19. this->addChild(menu,1);
20. return true;
21. }
22.  
23. void MenuLayer::menuStartCallback(Object *sender){
24. log("start game...");
25. auto gameScene = GameScene::create();
26. TransitionScene *transition = TransitionFade::create(1,gameScene);
27. Director::getInstance()->replaceScene(transition);
28. }

在菜單層中的init函數中，通過MenuItemSprite::create(playBtn,activePlayBtn,NULL,CC_CALLBACK_1(MenuLayer::menuStartCallback, this));創建了一個基於精靈的菜單項，其中第一個參數是一個精靈，第二個也是，只不過對第二個進行了Y方向的偏移。這樣做的目的是第一個參數是正常情況菜單項顯示的精靈（可以簡單認爲圖片），第二個是當選中菜單項時候菜單項顯示的精靈，這樣就形成了動態效果。第三個參數是無效時候的菜單項顯示，這裏不需要所以是NULL，第四個參數是一個回調函數，就是當點擊菜單項時候觸發的函數。於是當點擊的時候，就會調用：

1. void MenuLayer::menuStartCallback(Object *sender){
2. log("start game...");
3. auto gameScene = GameScene::create();
4. TransitionScene *transition = TransitionFade::create(1,gameScene);
5. Director::getInstance()->replaceScene(transition);
6. }

這裏除了打印log外，創建了一個主遊戲場景，並通過TransitionScene進行切換場景。還是回到上面，完成創建菜單項後，就可以創建菜單了，只要把菜單項放入菜單即可。當然這裏只有一個菜單項，你可以可以嘗試創建多個。最後將Menu對象放入層中，就好了。最後效果：

長得有點醜，哈哈，這裏只是通過一個簡單的例子來展示如何創建菜單場景的，你可以嘗試加入更好看的元素，創建一個更漂亮的菜單場景。當然創建菜單的過程類似。

總結

一個小例子，展示如何在cocos2d-x中創建菜單場景。