Learning Cocos2d-x for WP8（5）——详解Menu菜单

原文:Learning Cocos2d-x for WP8（5）——详解Menu菜单

C#(wp7)兄弟篇Learning Cocos2d-x for XNA（5）——详解Menu菜单

菜单是游戏必不可少的元素，菜单的实现，无非就是文字或者图片。

CCLabel元素更多的时候是实现说明的作用，用于导航性的菜单，更多时候是用CCMenu。

主要的几个Menu相关的元素的继承关系。

工程文件：MenuTest.h和MenuTest.cpp

CCMenuItemFont

核心语句

     //CCMenuItemFont
     CCMenuItemFont::setFontName("American Typewriter");//字体纹理
     CCMenuItemFont::setFontSize();
     CCMenuItemFont* menuItemFont1=CCMenuItemFont::itemFromString("START");
     CCMenuItemFont* menuItemFont2=CCMenuItemFont::itemFromString("QUIT");

     CCMenu* menu1=CCMenu::menuWithItems(menuItemFont1,menuItemFont2,NULL);
     menu1->alignItemsVertically();//菜单垂直排列
     menu1->setPosition(,);
     this->addChild(menu1);

注意menuWithItems(菜单项列表)中参数最后为“NULL”，这是个技术要求，欠缺会编译错误。

CCMenuItemSprite

添加三张图片至核心语句Assets文件夹下

核心语句

     //CCMenuItemSprite
     CCSprite* pSpriteNormal1=CCSprite::spriteWithFile("btn-about-normal.png");
     CCSprite* pSpriteSelected1=CCSprite::spriteWithFile("btn-about-selected.png");
     CCMenuItemSprite* menuItemSprite1=CCMenuItemSprite::itemFromNormalSprite(pSpriteNormal1,pSpriteSelected1,this,menu_selector(MenuTestLayer::btnAboutMenuCallback2));
     char imgMenuSprite[]="MenuSpritePlay.png";
     CCSprite* pSpriteNormal2=CCSprite::spriteWithFile(imgMenuSprite,CCRectMake(,,,));
     CCSprite* pSpriteSelected2=CCSprite::spriteWithFile(imgMenuSprite,CCRectMake(,,,));
     CCMenuItemSprite* menuItemSprite2=CCMenuItemSprite::itemFromNormalSprite(pSpriteNormal2,pSpriteSelected2,this,menu_selector(MenuTestLayer::btnPlayMenuCallback2));

     CCMenu* menu2=CCMenu::menuWithItems(menuItemSprite1,menuItemSprite2,NULL);
     menu2->alignItemsHorizontally();//菜单水平排列
     menu2->setPosition(,);
     this->addChild(menu2);

Normal状态：未点击菜单按钮时呈现的状态。

Selected状态：当点中菜单时选择的状态

注意第二种的实现方法，两个按钮在同一张图片中，显示一个按钮。

CCRectMake()起到决定性作用，四个参数为x、y、width、high。

x，y为图片从左上角为（0，0）起始坐标点的二维坐标，width为截取的图片的宽度，high为高度。

此获取一张图片下的部分图片方法，会在游戏中经常用到。

CCMenuItemImage

CCMenuItemImage与CCMenuItemSprite的实现方法差不多。

核心代码

     //CCMenuItemImage
     CCMenuItemFont* title3=CCMenuItemFont::itemFromString("MenuItemImageTitle");//标题
     title3->setIsEnabled(false);
     CCMenuItemImage* pMenuItemImage1=CCMenuItemImage::itemFromNormalImage("btn-about-normal.png","btn-about-selected.png",this,menu_selector(MenuTestLayer::btnAboutMenuCallback3));

     CCMenu* menu3=CCMenu::menuWithItems(title3,pMenuItemImage1,NULL);
     menu3->alignItemsVertically();//菜单垂直排列
     menu3->setPosition(,);
     this->addChild(menu3);

CCMenuItemToggle

开关按钮，有时候，这种按钮的实现会使用户体验更好

添加两张图片至Assets文件夹

常规的Toggle是文字，但也可用图片，点击切换哦。

核心代码

     //CCMenuItemToggle
     CCMenuItemFont::setFontName("American Typewriter");
     CCMenuItemFont::setFontSize();
     CCMenuItemFont* titleSound = CCMenuItemFont::itemFromString("Sound");
     titleSound->setIsEnabled(false);
     CCMenuItemToggle* menuItemToggle1=CCMenuItemToggle::itemWithTarget(this,
         menu_selector(MenuTestLayer::menuItemToggle1Callback),
         CCMenuItemFont::itemFromString("On"),
         CCMenuItemFont::itemFromString("Off"),
         NULL);
     //图片Toggle
     CCMenuItemFont* titleBackground = CCMenuItemFont::itemFromString("Background");
     titleBackground->setIsEnabled(false);
     CCMenuItemToggle* menuItemToggle2=CCMenuItemToggle::itemWithTarget(this,
         menu_selector(MenuTestLayer::menuItemToggle2Callback),
         CCMenuItemSprite::itemFromNormalSprite(CCSprite::spriteWithFile("bg_Sea1Mini.png"),CCSprite::spriteWithFile("bg_Sea1Mini.png")),
         CCMenuItemSprite::itemFromNormalSprite(CCSprite::spriteWithFile("bg_Sea2Mini.jpg"),CCSprite::spriteWithFile("bg_Sea2Mini.jpg")),
         NULL);

     CCMenu* menu4=CCMenu::menuWithItems(titleSound,menuItemToggle1,titleBackground,menuItemToggle2,NULL);
     menu4->alignItemsInColumns(,,NULL);
     menu4->setPosition(,);
     this->addChild(menu4);

CCLabelBMFont显示中文菜单

注意将.cpp源文件“高级保存选项”编码为“Unicode（UTF-8无签名）-代码页65001”

核心代码

     //CCLabelBMFont显示中文菜单（注意“高级保存选项”编码为“Unicode（UTF-8无签名）-代码页65001”）
     CCLabelBMFont* pLabelBMFFont1=CCLabelBMFont::labelWithString("国强", "fonts/YaHeiChinese.fnt", CCTextAlignmentRight, );
     CCMenuItemLabel* menuItemLabel1=CCMenuItemLabel::itemWithLabel(pLabelBMFFont1,this,menu_selector(MenuTestLayer::menuItemLabel1Callback));

     CCLabelBMFont* pLabelBMFFont2=CCLabelBMFont::labelWithString("菜单","fonts/YaHeiChinese.fnt");
     CCMenuItemLabel* menuItemLabel2=CCMenuItemLabel::itemWithLabel(pLabelBMFFont2,this,menu_selector(MenuTestLayer::menuItemLabel2Callback));

     CCMenu* menu5=CCMenu::menuWithItems(menuItemLabel1,menuItemLabel2,NULL);
     menu5->alignItemsVertically();
     menu5->setPosition(,);
     this->addChild(menu5);

其他部分代码为菜单点击事件Callbac函数

完整代码

MenuTest.h

 #ifndef _MENU_TEST_H_
 #define _MENU_TEST_H_

 #include "cocos2d.h"

 using namespace cocos2d;

 class MenuTestScene:public CCScene
 {
 public:
     MenuTestScene();
     ~MenuTestScene();
     virtual void onEnter();
 };

 class MenuTestLayer:public CCLayer
 {
 public:

     MenuTestLayer();
     ~MenuTestLayer();

 public:
     //CCMenuItemSprite
     void btnAboutMenuCallback2(CCObject* pSender);
     void btnPlayMenuCallback2(CCObject* pSender);

     //CCMenuItemImage
     void btnAboutMenuCallback3(CCObject* pSender);

     //menuItemToggle1
     void menuItemToggle1Callback(CCObject* pSender);
     void menuItemToggle2Callback(CCObject* pSender);

     //CCMenuItemLabel
     void menuItemLabel1Callback(CCObject* pSender);
     void menuItemLabel2Callback(CCObject* pSender);
 };

 #endif

MenuTest.cpp

 #include "pch.h"
 #include "Classes\MenuTest.h"

 //---------------------------------------
 //
 //MenuTsetLayer
 //
 //---------------------------------------
 MenuTestLayer::MenuTestLayer()
 {
     //CCMenuItemFont
     CCMenuItemFont::setFontName("American Typewriter");//字体纹理
     CCMenuItemFont::setFontSize();
     CCMenuItemFont* menuItemFont1=CCMenuItemFont::itemFromString("START");
     CCMenuItemFont* menuItemFont2=CCMenuItemFont::itemFromString("QUIT");

     CCMenu* menu1=CCMenu::menuWithItems(menuItemFont1,menuItemFont2,NULL);
     menu1->alignItemsVertically();//菜单垂直排列
     menu1->setPosition(,);
     this->addChild(menu1);

     //CCMenuItemSprite
     CCSprite* pSpriteNormal1=CCSprite::spriteWithFile("btn-about-normal.png");
     CCSprite* pSpriteSelected1=CCSprite::spriteWithFile("btn-about-selected.png");
     CCMenuItemSprite* menuItemSprite1=CCMenuItemSprite::itemFromNormalSprite(pSpriteNormal1,pSpriteSelected1,this,menu_selector(MenuTestLayer::btnAboutMenuCallback2));
     char imgMenuSprite[]="MenuSpritePlay.png";
     CCSprite* pSpriteNormal2=CCSprite::spriteWithFile(imgMenuSprite,CCRectMake(,,,));
     CCSprite* pSpriteSelected2=CCSprite::spriteWithFile(imgMenuSprite,CCRectMake(,,,));
     CCMenuItemSprite* menuItemSprite2=CCMenuItemSprite::itemFromNormalSprite(pSpriteNormal2,pSpriteSelected2,this,menu_selector(MenuTestLayer::btnPlayMenuCallback2));

     CCMenu* menu2=CCMenu::menuWithItems(menuItemSprite1,menuItemSprite2,NULL);
     menu2->alignItemsHorizontally();//菜单水平排列
     menu2->setPosition(,);
     this->addChild(menu2);

     //CCMenuItemImage
     CCMenuItemFont* title3=CCMenuItemFont::itemFromString("MenuItemImageTitle");//标题
     title3->setIsEnabled(false);
     CCMenuItemImage* pMenuItemImage1=CCMenuItemImage::itemFromNormalImage("btn-about-normal.png","btn-about-selected.png",this,menu_selector(MenuTestLayer::btnAboutMenuCallback3));

     CCMenu* menu3=CCMenu::menuWithItems(title3,pMenuItemImage1,NULL);
     menu3->alignItemsVertically();//菜单垂直排列
     menu3->setPosition(,);
     this->addChild(menu3);

     //CCMenuItemToggle
     CCMenuItemFont::setFontName("American Typewriter");
     CCMenuItemFont::setFontSize();
     CCMenuItemFont* titleSound = CCMenuItemFont::itemFromString("Sound");
     titleSound->setIsEnabled(false);
     CCMenuItemToggle* menuItemToggle1=CCMenuItemToggle::itemWithTarget(this,
         menu_selector(MenuTestLayer::menuItemToggle1Callback),
         CCMenuItemFont::itemFromString("On"),
         CCMenuItemFont::itemFromString("Off"),
         NULL);
     //图片Toggle
     CCMenuItemFont* titleBackground = CCMenuItemFont::itemFromString("Background");
     titleBackground->setIsEnabled(false);
     CCMenuItemToggle* menuItemToggle2=CCMenuItemToggle::itemWithTarget(this,
         menu_selector(MenuTestLayer::menuItemToggle2Callback),
         CCMenuItemSprite::itemFromNormalSprite(CCSprite::spriteWithFile("bg_Sea1Mini.png"),CCSprite::spriteWithFile("bg_Sea1Mini.png")),
         CCMenuItemSprite::itemFromNormalSprite(CCSprite::spriteWithFile("bg_Sea2Mini.jpg"),CCSprite::spriteWithFile("bg_Sea2Mini.jpg")),
         NULL);

     CCMenu* menu4=CCMenu::menuWithItems(titleSound,menuItemToggle1,titleBackground,menuItemToggle2,NULL);
     menu4->alignItemsInColumns(,,NULL);
     menu4->setPosition(,);
     this->addChild(menu4);

     //CCLabelBMFont显示中文菜单（注意“高级保存选项”编码为“Unicode（UTF-8无签名）-代码页65001”）
     CCLabelBMFont* pLabelBMFFont1=CCLabelBMFont::labelWithString("国强", "fonts/YaHeiChinese.fnt", CCTextAlignmentRight, );
     CCMenuItemLabel* menuItemLabel1=CCMenuItemLabel::itemWithLabel(pLabelBMFFont1,this,menu_selector(MenuTestLayer::menuItemLabel1Callback));

     CCLabelBMFont* pLabelBMFFont2=CCLabelBMFont::labelWithString("菜单","fonts/YaHeiChinese.fnt");
     CCMenuItemLabel* menuItemLabel2=CCMenuItemLabel::itemWithLabel(pLabelBMFFont2,this,menu_selector(MenuTestLayer::menuItemLabel2Callback));

     CCMenu* menu5=CCMenu::menuWithItems(menuItemLabel1,menuItemLabel2,NULL);
     menu5->alignItemsVertically();
     menu5->setPosition(,);
     this->addChild(menu5);
 }

 MenuTestLayer::~MenuTestLayer()
 {}

 //CCMenuItemSprite
 void MenuTestLayer::btnAboutMenuCallback2(CCObject* sender)
 {}

 void MenuTestLayer::btnPlayMenuCallback2(CCObject* sender)
 {}

 //CCMenuItemImage
 void MenuTestLayer::btnAboutMenuCallback3(CCObject* sender)
 {}

 //CCMenuItemToggle
 void MenuTestLayer::menuItemToggle1Callback(CCObject* sender)
 {}

 void MenuTestLayer::menuItemToggle2Callback(CCObject* sender)
 {}

 //CCMenuItemLabel
 void MenuTestLayer::menuItemLabel1Callback(CCObject* sender)
 {}

 void MenuTestLayer::menuItemLabel2Callback(CCObject* sender)
 {}

 //---------------------------------------
 //
 //MenuTestScene
 //
 //---------------------------------------
 MenuTestScene::MenuTestScene()
 {}

 MenuTestScene::~MenuTestScene()
 {}

 void MenuTestScene::onEnter()
 {
     CCScene::onEnter();
     CCLayer* pMenuTestLayer=new MenuTestLayer();
     this->addChild(pMenuTestLayer);
     pMenuTestLayer->release();
 }

完整代码运行效果

著作权声明：本文由http://www.cnblogs.com/suguoqiang 原创，欢迎转载分享。请尊重作者劳动，转载时保留该声明和作者博客链接，谢谢！