Cocos2d-x 在屏幕上渲染菜单并添加消息响应

转自：/article/1389519.html

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



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

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

[cpp] view
plaincopy

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

[cpp] view
plaincopy

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

[cpp] view
plaincopy

CCSprite *spritebg=CCSprite::create("bg.jpg"); //通过图片创建精灵

CCSize size=CCDirector::sharedDirector()->getWinSize();//获取屏幕大小

spritebg->setPosition(ccp(size.width/2,size.height/2));//将精灵的锚点设为屏幕的中间

addChild(spritebg,0); //将精灵添加到最底层，作为背景

[cpp] view
plaincopy

CCSprite *spritebg=CCSprite::create("bg.jpg"); //通过图片创建精灵

CCSize size=CCDirector::sharedDirector()->getWinSize();//获取屏幕大小

spritebg->setPosition(ccp(size.width/2,size.height/2));//将精灵的锚点设为屏幕的中间

addChild(spritebg,0); //将精灵添加到最底层，作为背景

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



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

[cpp] view
plaincopy

CCSprite *spritetile=CCSprite::create("tile.png");

CCSize s=spritetile->getContentSize();

spritetile->setPosition(ccp(size.width/2,size.height-s.height/2));

addChild(spritetile,1);//添加到第二层

[cpp] view
plaincopy

CCSprite *spritetile=CCSprite::create("tile.png");

CCSize s=spritetile->getContentSize();

spritetile->setPosition(ccp(size.width/2,size.height-s.height/2));

addChild(spritetile,1);//添加到第二层

效果如下：



接下来

[cpp] view
plaincopy

CCMenuItemImage *start=CCMenuItemImage::create("start1.png",//正常状态的图片

"start2.png",//按下去时的图片

this,

menu_selector(HelloWorld::startGame));

//当这个菜单项被按下的时候的回调函数，

//该函数设置为这个类的成员函数，返回值为void

//参数为CCObject*

CCSize startSize=start->getContentSize();//获取该菜单项的大小

CCMenuItemImage *select=CCMenuItemImage::create("select1.png",

"select2.png",

this,//回调函数所在的类
menu_selector(HelloWorld::selectGame));

CCSize selectSize=select->getContentSize();

start->setPosition(ccp(0,(size.height-s.height)/2));

//设置该菜单项在菜单中的位置，

//若不设置，则该菜单项的锚点与菜单的锚点相同

select->setPosition(ccp(0,((size.height-s.height)/2-startSize.height/2)/2));

CCMenu *menu=CCMenu::create(start,select,NULL);//创建菜单，并将两个菜单项传入

menu->setPosition(ccp(size.width/2,0));//设置菜单的位置，若不设置则为屏幕的正中间

addChild(menu,1);

[cpp] view
plaincopy

CCMenuItemImage *start=CCMenuItemImage::create("start1.png",//正常状态的图片

"start2.png",//按下去时的图片

this,

menu_selector(HelloWorld::startGame));

//当这个菜单项被按下的时候的回调函数，

//该函数设置为这个类的成员函数，返回值为void

//参数为CCObject*

CCSize startSize=start->getContentSize();//获取该菜单项的大小

CCMenuItemImage *select=CCMenuItemImage::create("select1.png",

"select2.png",

this,//回调函数所在的类 menu_selector(HelloWorld::selectGame));

CCSize selectSize=select->getContentSize();

start->setPosition(ccp(0,(size.height-s.height)/2));

//设置该菜单项在菜单中的位置，

//若不设置，则该菜单项的锚点与菜单的锚点相同

select->setPosition(ccp(0,((size.height-s.height)/2-startSize.height/2)/2));

CCMenu *menu=CCMenu::create(start,select,NULL);//创建菜单，并将两个菜单项传入

menu->setPosition(ccp(size.width/2,0));//设置菜单的位置，若不设置则为屏幕的正中间

addChild(menu,1);

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

[cpp] view
plaincopy

void HelloWorld::startGame(CCObject*
pSender)

{

CCLog("startGame");

}

[cpp] view
plaincopy

void HelloWorld::startGame(CCObject* pSender)

{

CCLog("startGame");

}

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



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

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

[cpp] view
plaincopy

CCMenuItemFont *oon=CCMenuItemFont::create("on",this,menu_selector(HelloWorld::oonGame));

//新建一个文字菜单

CCMenuItemFont *ooff=CCMenuItemFont::create("off",this,menu_selector(HelloWorld::ooffGame));

//再来一个

CCMenuItemToggle *toggle=CCMenuItemToggle::itemWithTarget(this,//回调函数所在的类

menu_selector(HelloWorld::toggleGame),//回调函数

oon,ooff,NULL //添加的菜单

);

toggle->setPosition(ccp(50,0));

CCMenuItemFont *Go=CCMenuItemFont::create("GO",this,menu_selector(HelloWorld::LetsGo));//这种菜单就不说了

Go->setPosition(ccp(70,80));

CCMenu *lastMenu=CCMenu::create(toggle,Go,NULL);

lastMenu->setPosition(ccp(50,50));

addChild(lastMenu,2);

[cpp] view
plaincopy

CCMenuItemFont *oon=CCMenuItemFont::create("on",this,menu_selector(HelloWorld::oonGame));

//新建一个文字菜单

CCMenuItemFont *ooff=CCMenuItemFont::create("off",this,menu_selector(HelloWorld::ooffGame));

//再来一个

CCMenuItemToggle *toggle=CCMenuItemToggle::itemWithTarget(this,//回调函数所在的类

menu_selector(HelloWorld::toggleGame),//回调函数

oon,ooff,NULL //添加的菜单

);

toggle->setPosition(ccp(50,0));

CCMenuItemFont *Go=CCMenuItemFont::create("GO",this,menu_selector(HelloWorld::LetsGo));//这种菜单就不说了

Go->setPosition(ccp(70,80));

CCMenu *lastMenu=CCMenu::create(toggle,Go,NULL);

lastMenu->setPosition(ccp(50,50));

addChild(lastMenu,2);



这时候显示的是“on”



这时候显示的是“off”

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

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

[cpp] view
plaincopy

bool HelloWorld::init()

{

bool bRet
= false;

do

{

CC_BREAK_IF(! CCLayer::init());

CCSprite *spritebg=CCSprite::create("bg.jpg"); //通过图片创建精灵

CCSize size=CCDirector::sharedDirector()->getWinSize();//获取屏幕大小

spritebg->setPosition(ccp(size.width/2,size.height/2));//将精灵的锚点设为屏幕的中间

addChild(spritebg,0); //将精灵添加到最底层，作为背景

CCSprite *spritetile=CCSprite::create("tile.png");

CCSize s=spritetile->getContentSize();

spritetile->setPosition(ccp(size.width/2,size.height-s.height/2));

addChild(spritetile,1);

CCMenuItemImage *start=CCMenuItemImage::create("start1.png",//正常状态的图片

"start2.png",//按下去时的图片

this,//回调函数所在的类

menu_selector(HelloWorld::startGame));

//当这个菜单项被按下的时候的回调函数，

//该函数设置为这个类的成员函数，返回值为void

//参数为CCObject*

CCSize startSize=start->getContentSize();//获取该菜单项的大小

CCMenuItemImage *select=CCMenuItemImage::create("select1.png",

"select2.png",

this,

menu_selector(HelloWorld::selectGame));

CCSize selectSize=select->getContentSize();

start->setPosition(ccp(0,(size.height-s.height)/2));

//设置该菜单项在菜单中的位置，

//若不设置，则该菜单项的锚点与菜单的锚点相同

select->setPosition(ccp(0,((size.height-s.height)/2-startSize.height/2)/2));

CCMenu *menu=CCMenu::create(start,select,NULL);//创建菜单，并将两个菜单项传入

menu->setPosition(ccp(size.width/2,0));//设置菜单的位置，若不设置则为屏幕的正中间

addChild(menu,1);

CCMenuItemImage *question=CCMenuItemImage::create("wh1.png","wh2.png",

this,menu_selector(HelloWorld::questionGame));

CCSize qSize=question->getContentSize();

question->setPosition(ccp(0,qSize.height+20));

CCMenuItemImage *settings=CCMenuItemImage::create("sz1.png","sz2.png",

this,menu_selector(HelloWorld::settingGame));

CCMenu *m=CCMenu::create(question,settings,NULL);

m->setPosition(ccp(qSize.width,qSize.height));

addChild(m,1);

CCMenuItemFont *oon=CCMenuItemFont::create("on",this,menu_selector(HelloWorld::oonGame));

//新建一个文字菜单

CCMenuItemFont *ooff=CCMenuItemFont::create("off",this,menu_selector(HelloWorld::ooffGame));

//再来一个

CCMenuItemToggle *toggle=CCMenuItemToggle::itemWithTarget(this,//回调函数所在的类

menu_selector(HelloWorld::toggleGame),//回调函数

oon,ooff,NULL //添加的菜单

);

toggle->setPosition(ccp(50,0));

CCMenuItemFont *Go=CCMenuItemFont::create("GO",this,menu_selector(HelloWorld::LetsGo));

Go->setPosition(ccp(70,80));

CCMenu *lastMenu=CCMenu::create(toggle,Go,NULL);

lastMenu->setPosition(ccp(50,50));

addChild(lastMenu,2);

bRet = true;

} while (0);

return bRet;

}

[cpp] view
plaincopy

bool HelloWorld::init()

{

bool bRet = false;

do

{

CC_BREAK_IF(! CCLayer::init());

CCSprite *spritebg=CCSprite::create("bg.jpg"); //通过图片创建精灵

CCSize size=CCDirector::sharedDirector()->getWinSize();//获取屏幕大小

spritebg->setPosition(ccp(size.width/2,size.height/2));//将精灵的锚点设为屏幕的中间

addChild(spritebg,0); //将精灵添加到最底层，作为背景

CCSprite *spritetile=CCSprite::create("tile.png");

CCSize s=spritetile->getContentSize();

spritetile->setPosition(ccp(size.width/2,size.height-s.height/2));

addChild(spritetile,1);

CCMenuItemImage *start=CCMenuItemImage::create("start1.png",//正常状态的图片

"start2.png",//按下去时的图片

this,//回调函数所在的类

menu_selector(HelloWorld::startGame));

//当这个菜单项被按下的时候的回调函数，

//该函数设置为这个类的成员函数，返回值为void

//参数为CCObject*

CCSize startSize=start->getContentSize();//获取该菜单项的大小

CCMenuItemImage *select=CCMenuItemImage::create("select1.png",

"select2.png",

this,

menu_selector(HelloWorld::selectGame));

CCSize selectSize=select->getContentSize();

start->setPosition(ccp(0,(size.height-s.height)/2));

//设置该菜单项在菜单中的位置，

//若不设置，则该菜单项的锚点与菜单的锚点相同

select->setPosition(ccp(0,((size.height-s.height)/2-startSize.height/2)/2));

CCMenu *menu=CCMenu::create(start,select,NULL);//创建菜单，并将两个菜单项传入

menu->setPosition(ccp(size.width/2,0));//设置菜单的位置，若不设置则为屏幕的正中间

addChild(menu,1);

CCMenuItemImage *question=CCMenuItemImage::create("wh1.png","wh2.png",

this,menu_selector(HelloWorld::questionGame));

CCSize qSize=question->getContentSize();

question->setPosition(ccp(0,qSize.height+20));

CCMenuItemImage *settings=CCMenuItemImage::create("sz1.png","sz2.png",

this,menu_selector(HelloWorld::settingGame));

CCMenu *m=CCMenu::create(question,settings,NULL);

m->setPosition(ccp(qSize.width,qSize.height));

addChild(m,1);

CCMenuItemFont *oon=CCMenuItemFont::create("on",this,menu_selector(HelloWorld::oonGame));

//新建一个文字菜单

CCMenuItemFont *ooff=CCMenuItemFont::create("off",this,menu_selector(HelloWorld::ooffGame));

//再来一个

CCMenuItemToggle *toggle=CCMenuItemToggle::itemWithTarget(this,//回调函数所在的类

menu_selector(HelloWorld::toggleGame),//回调函数

oon,ooff,NULL //添加的菜单

);

toggle->setPosition(ccp(50,0));

CCMenuItemFont *Go=CCMenuItemFont::create("GO",this,menu_selector(HelloWorld::LetsGo));

Go->setPosition(ccp(70,80));

CCMenu *lastMenu=CCMenu::create(toggle,Go,NULL);

lastMenu->setPosition(ccp(50,50));

addChild(lastMenu,2);

bRet = true;

} while (0);

return bRet;

}

下面是所有的回调函数：

[cpp] view
plaincopy

void HelloWorld::startGame(CCObject*
pSender)

{

CCLog("startGame");

}

void HelloWorld::selectGame(CCObject*
pSender)

{

CCLog("selectGame");

}

void HelloWorld::settingGame(CCObject*
pSender)

{

CCLog("settingGame");

}

void HelloWorld::questionGame(CCObject*
pSender)

{

CCLog("questionGame");

}

void HelloWorld::oonGame(CCObject*
pSender)

{

CCLog("oonGame");

}

void HelloWorld::ooffGame(CCObject*
pSender)

{

CCLog("ooffGame");

}

void HelloWorld::toggleGame(CCObject*
pSender)

{

CCLog("toggleGame");

}

void HelloWorld::LetsGo(CCObject*
pSender)

{

CCLog("LetsGo");

}

[cpp] view
plaincopy

void HelloWorld::startGame(CCObject* pSender)

{

CCLog("startGame");

}

void HelloWorld::selectGame(CCObject* pSender)

{

CCLog("selectGame");

}

void HelloWorld::settingGame(CCObject* pSender)

{

CCLog("settingGame");

}

void HelloWorld::questionGame(CCObject* pSender)

{

CCLog("questionGame");

}

void HelloWorld::oonGame(CCObject* pSender)

{

CCLog("oonGame");

}

void HelloWorld::ooffGame(CCObject* pSender)

{

CCLog("ooffGame");

}

void HelloWorld::toggleGame(CCObject* pSender)

{

CCLog("toggleGame");

}

void HelloWorld::LetsGo(CCObject* pSender)

{

CCLog("LetsGo");

}