【Cocos2d-x游戏引擎开发笔记(3)】在屏幕上渲染菜单并添加消息响应

转载自： http://blog.youkuaiyun.com/zhy_cheng/article/details/8270508

 

上一讲介绍了渲染文字，这次介绍在屏幕上渲染菜单，还是先看看我做出的效果吧：

 

这个效果还不错吧。图片都是解压《捕鱼达人》，然后自己ps得到的。

 

 

首先将屏幕大小设置为480x320

 

[cpp]  view plain copy

1. eglView->setFrameSize(480, 320);//设置界面大小  

 

[cpp]  view plain copy

1. CCSprite *spritebg=CCSprite::create("bg.jpg");   //通过图片创建精灵  
2. CCSize size=CCDirector::sharedDirector()->getWinSize();//获取屏幕大小  
3.   
4. spritebg->setPosition(ccp(size.width/2,size.height/2));//将精灵的锚点设为屏幕的中间  
5. addChild(spritebg,0);         //将精灵添加到最底层，作为背景  

背景图片通过精灵来实现，效果如下

 

接着添加添加标题，和背景一样，不过要注意，添加在背景的上面

[cpp]  view plain copy

1. CCSprite *spritetile=CCSprite::create("tile.png");  
2. CCSize s=spritetile->getContentSize();  
3. spritetile->setPosition(ccp(size.width/2,size.height-s.height/2));  
4. addChild(spritetile,1);//添加到第二层  

效果如下：

 

接下来

[cpp]  view plain copy

1. CCMenuItemImage *start=CCMenuItemImage::create("start1.png",//正常状态的图片  
2.             "start2.png",//按下去时的图片  
3.             this,  
4.             menu_selector(HelloWorld::startGame));  
5.         //当这个菜单项被按下的时候的回调函数，  
6.         //该函数设置为这个类的成员函数，返回值为void  
7.         //参数为CCObject*  
8.         CCSize startSize=start->getContentSize();//获取该菜单项的大小  
9.   
10.         CCMenuItemImage *select=CCMenuItemImage::create("select1.png",  
11.             "select2.png",  
12.             this,//回调函数所在的类                                                             menu_selector(HelloWorld::selectGame));  
13.   
14.         CCSize selectSize=select->getContentSize();  
15.         start->setPosition(ccp(0,(size.height-s.height)/2));  
16.         //设置该菜单项在菜单中的位置，  
17.         //若不设置，则该菜单项的锚点与菜单的锚点相同  
18.   
19.         select->setPosition(ccp(0,((size.height-s.height)/2-startSize.height/2)/2));  
20.   
21.         CCMenu *menu=CCMenu::create(start,select,NULL);//创建菜单，并将两个菜单项传入  
22.           
23.   
24.         menu->setPosition(ccp(size.width/2,0));//设置菜单的位置，若不设置则为屏幕的正中间  
25.         addChild(menu,1);  

 

这里创建两个菜单项，并加入到菜单中。回调函数先在头文件中声明，在源文件中实现

[cpp]  view plain copy

1. void HelloWorld::startGame(CCObject* pSender)  
2. {  
3.     CCLog("startGame");  
4. }  

CCLog();在输出打印字符串。现在的效果如下：

 

然后左边的两个也一样，这里就不多说了，最后把代码贴上来。

 

下面要说的是CCMenuToggle菜单，这个菜单点一下编成另外一个菜单

[cpp]  view plain copy

1. CCMenuItemFont *oon=CCMenuItemFont::create("on",this,menu_selector(HelloWorld::oonGame));  
2. //新建一个文字菜单  
3. CCMenuItemFont *ooff=CCMenuItemFont::create("off",this,menu_selector(HelloWorld::ooffGame));  
4. //再来一个  
5. CCMenuItemToggle *toggle=CCMenuItemToggle::itemWithTarget(this,//回调函数所在的类  
6.     menu_selector(HelloWorld::toggleGame),//回调函数  
7.     oon,ooff,NULL    //添加的菜单  
8.     );  
9. toggle->setPosition(ccp(50,0));  
10.   
11. CCMenuItemFont *Go=CCMenuItemFont::create("GO",this,menu_selector(HelloWorld::LetsGo));//这种菜单就不说了  
12. Go->setPosition(ccp(70,80));  
13.   
14. CCMenu *lastMenu=CCMenu::create(toggle,Go,NULL);  
15. lastMenu->setPosition(ccp(50,50));  
16. addChild(lastMenu,2);  

 

这时候显示的是“on”

这时候显示的是“off”

注意：点击CCMenuItemToggle的时候，回调的函数是CCMenuItemToggle的回调函数。

最后当然是贴出代码，下面是init中的全部代码：

[cpp]  view plain copy

1. bool HelloWorld::init()  
2. {  
3.     bool bRet = false;  
4.     do   
5.     {  
6.   
7.         CC_BREAK_IF(! CCLayer::init());  
8.   
9.           
10.         CCSprite *spritebg=CCSprite::create("bg.jpg");   //通过图片创建精灵  
11.         CCSize size=CCDirector::sharedDirector()->getWinSize();//获取屏幕大小  
12.   
13.         spritebg->setPosition(ccp(size.width/2,size.height/2));//将精灵的锚点设为屏幕的中间  
14.         addChild(spritebg,0);         //将精灵添加到最底层，作为背景  
15.   
16.           
17.         CCSprite *spritetile=CCSprite::create("tile.png");  
18.         CCSize s=spritetile->getContentSize();  
19.         spritetile->setPosition(ccp(size.width/2,size.height-s.height/2));  
20.         addChild(spritetile,1);  
21.   
22.           
23.   
24.         CCMenuItemImage *start=CCMenuItemImage::create("start1.png",//正常状态的图片  
25.             "start2.png",//按下去时的图片  
26.             this,//回调函数所在的类  
27.   
28.             menu_selector(HelloWorld::startGame));  
29.         //当这个菜单项被按下的时候的回调函数，  
30.         //该函数设置为这个类的成员函数，返回值为void  
31.         //参数为CCObject*  
32.         CCSize startSize=start->getContentSize();//获取该菜单项的大小  
33.   
34.         CCMenuItemImage *select=CCMenuItemImage::create("select1.png",  
35.             "select2.png",  
36.             this,  
37.             menu_selector(HelloWorld::selectGame));  
38.   
39.         CCSize selectSize=select->getContentSize();  
40.         start->setPosition(ccp(0,(size.height-s.height)/2));  
41.         //设置该菜单项在菜单中的位置，  
42.         //若不设置，则该菜单项的锚点与菜单的锚点相同  
43.   
44.         select->setPosition(ccp(0,((size.height-s.height)/2-startSize.height/2)/2));  
45.   
46.         CCMenu *menu=CCMenu::create(start,select,NULL);//创建菜单，并将两个菜单项传入  
47.           
48.   
49.         menu->setPosition(ccp(size.width/2,0));//设置菜单的位置，若不设置则为屏幕的正中间  
50.         addChild(menu,1);  
51.   
52.           
53.           
54.         CCMenuItemImage *question=CCMenuItemImage::create("wh1.png","wh2.png",  
55.             this,menu_selector(HelloWorld::questionGame));  
56.         CCSize qSize=question->getContentSize();  
57.         question->setPosition(ccp(0,qSize.height+20));  
58.         CCMenuItemImage *settings=CCMenuItemImage::create("sz1.png","sz2.png",  
59.             this,menu_selector(HelloWorld::settingGame));  
60.   
61.         CCMenu *m=CCMenu::create(question,settings,NULL);  
62.           
63.         m->setPosition(ccp(qSize.width,qSize.height));  
64.         addChild(m,1);  
65.   
66.   
67.   
68.   
69.         CCMenuItemFont *oon=CCMenuItemFont::create("on",this,menu_selector(HelloWorld::oonGame));  
70.         //新建一个文字菜单  
71.         CCMenuItemFont *ooff=CCMenuItemFont::create("off",this,menu_selector(HelloWorld::ooffGame));  
72.         //再来一个  
73.         CCMenuItemToggle *toggle=CCMenuItemToggle::itemWithTarget(this,//回调函数所在的类  
74.             menu_selector(HelloWorld::toggleGame),//回调函数  
75.             oon,ooff,NULL    //添加的菜单  
76.             );  
77.         toggle->setPosition(ccp(50,0));  
78.   
79.         CCMenuItemFont *Go=CCMenuItemFont::create("GO",this,menu_selector(HelloWorld::LetsGo));  
80.         Go->setPosition(ccp(70,80));  
81.   
82.         CCMenu *lastMenu=CCMenu::create(toggle,Go,NULL);  
83.         lastMenu->setPosition(ccp(50,50));  
84.         addChild(lastMenu,2);  
85.   
86.   
87.   
88.         bRet = true;  
89.     } while (0);  
90.   
91.     return bRet;  
92. }  

 下面是所有的回调函数：

[cpp]  view plain copy

1. void HelloWorld::startGame(CCObject* pSender)  
2. {  
3.     CCLog("startGame");  
4. }  
5.   
6. void HelloWorld::selectGame(CCObject* pSender)  
7. {  
8.     CCLog("selectGame");  
9. }  
10.   
11. void HelloWorld::settingGame(CCObject* pSender)  
12. {  
13.     CCLog("settingGame");  
14. }  
15.   
16. void HelloWorld::questionGame(CCObject* pSender)  
17. {  
18.     CCLog("questionGame");  
19. }  
20.   
21.   
22. void HelloWorld::oonGame(CCObject* pSender)  
23. {  
24.     CCLog("oonGame");  
25. }  
26.   
27. void HelloWorld::ooffGame(CCObject* pSender)  
28. {  
29.     CCLog("ooffGame");  
30.   
31. }  
32.   
33. void HelloWorld::toggleGame(CCObject* pSender)  
34. {  
35.     CCLog("toggleGame");  
36. }  
37.   
38. void HelloWorld::LetsGo(CCObject* pSender)  
39. {  
40.     CCLog("LetsGo");  
41. }