coco2d-x 基础系列 (06) 菜单按钮的回调设计

coco2d-x 中可以设计的菜单选项

（1）文字菜单项：MenuItemLabel、MenuItemAtlasFont、MenuItemFont；

（2）图片菜单项：MenuItemSprite、MenuItemImage；

（3）切换菜单项：MenuItemToggle。

本例中我们新建一个menu, menu中暂时新建一个item, item中会点击回调事件。

#include "Frames.h"USING_NS_CC;Scene *Frames::createScene() {// Some upfront items that we needauto dirs = Director::getInstance();Size visibleSize = dirs->getVisibleSize();Vec2 origin = dirs->getVisibleOrigin();Size playingSize = Size(visibleSize.width, visibleSize.height / 8 * 7);// create a sceneauto scene = Scene::create();// create a node to hold non-sprites.auto nodeItems = Node::create();nodeItems->setName("nodeItems");// create a node to hold menuauto menuNode = Node::create();menuNode->setName("menuNode");auto menuItem1 = MenuItemFont::create("First: create a sprite");menuItem1->setFontNameObj("Marker Felt.ttf");menuItem1->setFontSizeObj(20);menuItem1->setName("menuItem1");menuItem1->setPosition(visibleSize.width/2, visibleSize.height - 30);menuItem1->setCallback([&](Ref *sender) {auto dirs = Director::getInstance()->getRunningScene();auto newSprite = Sprite::create("smile_100.png");newSprite->setName("sprite1");newSprite->setPosition(100, 56);newSprite->setAnchorPoint(Vec2(0.5, 0.5));dirs->addChild(newSprite, 1);});cocos2d::Vector<MenuItem *>menuItems;menuItems.pushBack(menuItem1);auto menu = Menu::createWithArray(menuItems);menu->setName("menu");menuNode->addChild(menu, 1);menu->setPosition(Vec2::ZERO);scene->addChild(menuNode, 2);return scene;}

通过点击文字回调创建一张新sprite.

接下来为这个程序添加更多的按钮，更多的回调。

新增加一个红点，在newSprite1的位置上，这时候addChild的作用就比较明显，如果将point1的2改成0,则按照树型的结构关系point1先渲染，newSprite后渲染，会把红点给盖住。

auto newSprite = Sprite::create("smile_100.png");newSprite->setName("sprite1");newSprite->setPosition(100, 56);newSprite->setAnchorPoint(Vec2(0.5, 0.5));dirs->addChild(newSprite, 1);auto point1 = Sprite::create("dot.png");point1->setName("point1");point1->setPosition(newSprite->getPosition());dirs->addChild(point1, 2);auto anode = dirs->getChildByName("menuNode");auto bnode = anode->getChildByName("menu");auto cnode = bnode->getChildByName("menuItem1");

增加一个新按键之后

auto menuItem2 = MenuItemFont::create("MoveTo/MoveBy");menuItem2->setFontNameObj("Marker Felt.ttf");menuItem2->setFontSizeObj(20);menuItem2->setName("menuItem2");menuItem2->setVisible(false);menuItem2->setPosition(visibleSize.width/2, visibleSize.height - 30);menuItem2->setCallback([&](Ref *sender) {auto dirs = Director::getInstance()->getRunningScene();auto newSprite2 = Sprite::create("green.png");newSprite2->setPosition(200, 40);newSprite2->setName("sprite2");dirs->addChild(newSprite2, 1);});cocos2d::Vector<MenuItem *>menuItems;menuItems.pushBack(menuItem1);menuItems.pushBack(menuItem2);auto menu = Menu::createWithArray(menuItems);menu->setName("menu");menuNode->addChild(menu, 1);menu->setPosition(Vec2::ZERO);scene->addChild(menuNode, 2);

执行效果，可以看到显示MoveTo/MoveBy选项

点击moveTo/moveBy选项

可以看到新增加了一张图片，但是现在是需要把原来创建的删除，那么需要增加如下代码

auto dirs = Director::getInstance()->getRunningScene();dirs->removeChildByName("sprite1");dirs->removeChildByName("sprite2");dirs->removeChildByName("point1");

这里FrameAnimation没有设计好，图片有点问题，之前的文章中有条鱼的没有问题。

直接粘贴自己写的源码，都是重复性操作，比较好理解。

#include "Frames.h"USING_NS_CC;Scene *Frames::createScene() {// Some upfront items that we needauto dirs = Director::getInstance();Size visibleSize = dirs->getVisibleSize();Vec2 origin = dirs->getVisibleOrigin();// create a sceneauto scene = Scene::create();// create a node to hold non-sprites.auto nodeItems = Node::create();nodeItems->setName("nodeItems");// create a node to hold menuauto menuNode = Node::create();menuNode->setName("menuNode");auto menuItem1 = MenuItemFont::create("First: create a sprite");menuItem1->setFontNameObj("Marker Felt.ttf");menuItem1->setFontSizeObj(32);menuItem1->setName("menuItem1");menuItem1->setPosition(visibleSize.width/2, visibleSize.height - 60);menuItem1->setCallback([&](Ref *sender) {auto dirs = Director::getInstance()->getRunningScene();auto newSprite = Sprite::create("yellow.png");newSprite->setName("sprite1");newSprite->setPosition(100, 56);newSprite->setAnchorPoint(Vec2(0.5, 0.5));dirs->addChild(newSprite, 1);auto point1 = Sprite::create("dot.png");point1->setName("point1");point1->setPosition(newSprite->getPosition());dirs->addChild(point1, 2);auto newSprite2 = Sprite::create("green.png");newSprite2->setPosition(200, 80);newSprite2->setName("sprite2");dirs->addChild(newSprite2, 1);auto anode = dirs->getChildByName("menuNode");auto bnode = anode->getChildByName("menu");auto cnode = bnode->getChildByName("menuItem1");cnode->setVisible(false);cnode = bnode->getChildByName("menuItem2");cnode->setVisible(true);});auto menuItem2 = MenuItemFont::create("MoveTo/MoveBy");menuItem2->setFontNameObj("Marker Felt.ttf");menuItem2->setFontSizeObj(32);menuItem2->setName("menuItem2");menuItem2->setVisible(false);menuItem2->setPosition(visibleSize.width/2, visibleSize.height - 60);menuItem2->setCallback([&](Ref *sender) {auto dirs = Director::getInstance()->getRunningScene();dirs->removeChildByName("sprite1");dirs->removeChildByName("sprite2");dirs->removeChildByName("point1");auto newSprite3 = Sprite::create("red.png");newSprite3->setPosition(200, 150);newSprite3->setName("sprite3");dirs->addChild(newSprite3, 1);auto moveBy = MoveBy::create(2, Point(500, 0));auto moveTo = MoveTo::create(2, Point(300, 56));auto delay = DelayTime::create(1.0f);auto sequence1 = Sequence::create(moveBy, delay, NULL);auto sequence2 = Sequence::create(delay, moveTo, NULL);newSprite3->runAction(sequence1);auto newSprite4 = Sprite::create("blond.png");newSprite4->setPosition(600, 56);newSprite4->setName("sprite4");dirs->addChild(newSprite4, 1);newSprite4->runAction(sequence2);auto runningMenu = MenuItemFont::create("Now at: MoveTo/MoveBy");runningMenu->setPosition(200, 30);runningMenu->setName("runningMenu");runningMenu->setFontSizeObj(20);dirs->addChild(runningMenu);auto anode = dirs->getChildByName("menuNode");auto bnode = anode->getChildByName("menu");auto cnode = bnode->getChildByName("menuItem2");cnode->setVisible(false);cnode = bnode->getChildByName("menuItem3");cnode->setVisible(true);});auto menuItem3 = MenuItemFont::create("FadeIn/FadeOut");menuItem3->setFontNameObj("Marker Felt.ttf");menuItem3->setFontSizeObj(32);menuItem3->setName("menuItem3");menuItem3->setVisible(false);menuItem3->setPosition(visibleSize.width/2, visibleSize.height - 60);menuItem3->setCallback([&](Ref *sender) {auto dirs = Director::getInstance()->getRunningScene();dirs->removeChildByName("sprite3");dirs->removeChildByName("sprite4");auto newSprite5 = Sprite::create("ice_blue.png");newSprite5->setPosition(400, 300);newSprite5->setName("sprite5");dirs->addChild(newSprite5, 1);auto fadeIn = FadeIn::create(1.0f);newSprite5->runAction(fadeIn);auto newSprite6 = Sprite::create("green_yellow.png");newSprite6->setPosition(500, 300);newSprite6->setName("sprite6");dirs->addChild(newSprite6, 1);auto fadeOut = FadeOut::create(2.0f);newSprite6->runAction(fadeOut);dirs->removeChildByName("runningMenu");auto runningMenu = MenuItemFont::create("Now at: FadeIn/FadeOut");runningMenu->setPosition(200, 30);runningMenu->setName("runningMenu");runningMenu->setFontSizeObj(20);dirs->addChild(runningMenu);auto anode = dirs->getChildByName("menuNode");auto bnode = anode->getChildByName("menu");auto cnode = bnode->getChildByName("menuItem3");cnode->setVisible(false);cnode = bnode->getChildByName("menuItem4");cnode->setVisible(true);});auto menuItem4 = MenuItemFont::create("Animate");menuItem4->setFontNameObj("Marker Felt.ttf");menuItem4->setFontSizeObj(32);menuItem4->setName("menuItem4");menuItem4->setVisible(false);menuItem4->setPosition(visibleSize.width/2, visibleSize.height - 60);menuItem4->setCallback([&](Ref *sender) {auto dirs = Director::getInstance()->getRunningScene();dirs->removeChildByName("sprite5");dirs->removeChildByName("sprite6");auto newSprite7 = Sprite::create("Blue_Front1.png");newSprite7->setPosition(400, 400);newSprite7->setName("sprite7");dirs->addChild(newSprite7, 1);auto moveBy = MoveBy::create(2.0f, Vec2(100, 0));newSprite7->runAction(moveBy);// now lets animate the sprite we movedVector<SpriteFrame *> animFrames;animFrames.reserve(12);animFrames.pushBack(SpriteFrame::create("Blue_Front1.png", Rect(0, 0, 65, 81)));animFrames.pushBack(SpriteFrame::create("Blue_Front2.png", Rect(0, 0, 65, 81)));animFrames.pushBack(SpriteFrame::create("Blue_Front3.png", Rect(0, 0, 65, 81)));animFrames.pushBack(SpriteFrame::create("Blue_Left1.png", Rect(0, 0, 65, 81)));animFrames.pushBack(SpriteFrame::create("Blue_Left2.png", Rect(0, 0, 65, 81)));animFrames.pushBack(SpriteFrame::create("Blue_Left3.png", Rect(0, 0, 65, 81)));animFrames.pushBack(SpriteFrame::create("Blue_Back1.png", Rect(0, 0, 65, 81)));animFrames.pushBack(SpriteFrame::create("Blue_Back2.png", Rect(0, 0, 65, 81)));animFrames.pushBack(SpriteFrame::create("Blue_Back3.png", Rect(0, 0, 65, 81)));animFrames.pushBack(SpriteFrame::create("Blue_Right1.png", Rect(0, 0, 65, 81)));animFrames.pushBack(SpriteFrame::create("Blue_Right2.png", Rect(0, 0, 65, 81)));animFrames.pushBack(SpriteFrame::create("Blue_Right3.png", Rect(0, 0, 65, 81)));// create the animation out of the framesAnimation *animation = Animation::createWithSpriteFrames(animFrames, 0.1f);Animate *animate = Animate::create(animation);// run it and repeat it forevernewSprite7->runAction(RepeatForever::create(animate));dirs->removeChildByName("runningMenu");auto runningMenu = MenuItemFont::create("Now at: Animate");runningMenu->setPosition(200, 30);runningMenu->setName("runningMenu");runningMenu->setFontSizeObj(20);dirs->addChild(runningMenu);auto anode = dirs->getChildByName("menuNode");auto bnode = anode->getChildByName("menu");auto cnode = bnode->getChildByName("menuItem4");cnode->setVisible(false);cnode = bnode->getChildByName("menuItem5");cnode->setVisible(true);});auto menuItem5 = MenuItemFont::create("RotateTo/RotateBy");menuItem5->setFontNameObj("Marker Felt.ttf");menuItem5->setName("menuItem5");menuItem5->setVisible(false);menuItem5->setPosition(visibleSize.width/2, visibleSize.height - 60);menuItem5->setCallback([&](Ref *sender) {auto dirs = Director::getInstance()->getRunningScene();dirs->removeChildByName("sprite7");auto newSprite8 = Sprite::create("origin_red.png");newSprite8->setPosition(500, 300);newSprite8->setName("sprite8");dirs->addChild(newSprite8, 1);auto point2 = Sprite::create("dot.png");point2->setName("point2");point2->setPosition(newSprite8->getPosition());dirs->addChild(point2, 2);auto rotateTo = RotateTo::create(2.0f, 40.0f);newSprite8->runAction(rotateTo);auto rotateBy = RotateBy::create(2.0f, -20.0f);newSprite8->runAction(rotateBy);dirs->removeChildByName("runningMenu");auto runningMenu = MenuItemFont::create("Now at: RotateTo/RotateBy");runningMenu->setPosition(200, 30);runningMenu->setName("runningMenu");runningMenu->setFontSizeObj(20);dirs->addChild(runningMenu);auto anode = dirs->getChildByName("menuNode");auto bnode = anode->getChildByName("menu");auto cnode = bnode->getChildByName("menuItem5");cnode->setVisible(false);cnode = bnode->getChildByName("menuItem6");cnode->setVisible(true);});auto menuItem6 = MenuItemFont::create("TintTo/TintBy");menuItem6->setName("menuItem6");menuItem6->setVisible(false);menuItem6->setPosition(visibleSize.width/2, visibleSize.height - 60);menuItem6->setCallback([&](Ref *sender) {auto dirs = Director::getInstance()->getRunningScene();dirs->removeChildByName("sprite8");dirs->removeChildByName("point2");auto newSprite9 = Sprite::create("tan.png");newSprite9->setPosition(300, 400);newSprite9->setName("sprite9");dirs->addChild(newSprite9, 1);// Tints a Node that implements the NodeRGB protocol from current tint to a custom one.// static TintBy * create (float duration, GLshort deltaRed, GLshort deltaGreen, GLshort deltaBlue)auto tintTo = TintTo::create(2.0f, 120.0f, 232.0f, 254.0f);newSprite9->runAction(tintTo);auto newSprite10 = Sprite::create("hedgewar.png");newSprite10->setPosition(500, 400);newSprite10->setName("sprite10");dirs->addChild(newSprite10, 1);auto tintBy = TintBy::create(2.0f, 30.0f, 0, 0);newSprite10->runAction(tintBy);dirs->removeChildByName("runningMenu");auto runningMenu = MenuItemFont::create("Now at: TintTo/TintBy");runningMenu->setPosition(200, 30);runningMenu->setName("runningMenu");runningMenu->setFontSizeObj(20);dirs->addChild(runningMenu);auto anode = dirs->getChildByName("menuNode");auto bnode = anode->getChildByName("menu");auto cnode = bnode->getChildByName("menuItem6");cnode->setVisible(false);cnode = bnode->getChildByName("menuItem7");cnode->setVisible(true);});auto menuItem7 = MenuItemFont::create("Ease");menuItem7->setVisible(false);menuItem7->setName("menuItem7");menuItem7->setPosition(visibleSize.width/2, visibleSize.height - 60);menuItem7->setCallback([&](Ref *sender) {auto dirs = Director::getInstance()->getRunningScene();dirs->removeChildByName("sprite9");dirs->removeChildByName("sprite10");auto newSprite11 = Sprite::create("Blue_Front1.png");newSprite11->setPosition(300, 400);newSprite11->setName("sprite11");dirs->addChild(newSprite11, 1);auto move= MoveBy::create(2, Point(200, Director::getInstance()->getVisibleSize().height - newSprite11->getContentSize().height));auto move_back = move->reverse();auto move_ease_in = EaseBounceIn::create(move->clone());auto move_ease_in_back = move_ease_in->reverse();auto move_ease_out= EaseBounceOut::create(move->clone());auto move_ease_out_back = move_ease_out->reverse();auto delay = DelayTime::create(0.25f);auto seq1 = Sequence::create(move_ease_in, delay,move_ease_in_back, delay->clone(), nullptr);newSprite11->runAction(RepeatForever::create(seq1));dirs->removeChildByName("runningMenu");auto runningMenu = MenuItemFont::create("Now at: Ease");runningMenu->setPosition(200, 30);runningMenu->setName("runningMenu");runningMenu->setFontSizeObj(20);dirs->addChild(runningMenu);auto anode = dirs->getChildByName("menuNode");auto bnode = anode->getChildByName("menu");auto cnode = bnode->getChildByName("menuItem7");cnode->setVisible(false);cnode = bnode->getChildByName("menuItem8");cnode->setVisible(true);});auto menuItem8 = MenuItemFont::create("Sequence");menuItem8->setPosition(visibleSize.width/2, visibleSize.height - 60);menuItem8->setName("menuItem8");menuItem8->setVisible(false);menuItem8->setCallback([&](Ref *sender) {auto dirs = Director::getInstance()->getRunningScene();dirs->removeChildByName("sprite11");auto newSprite12 = Sprite::create("tan.png");newSprite12->setPosition(300, 300);newSprite12->setName("sprite12");dirs->addChild(newSprite12, 1);auto jump = JumpBy::create(0.5, Point(0, 0), 100, 1);auto rotate = RotateTo::create(2.0f, 10);// create a few callbacksauto callbackJump = CallFunc::create([]() {log("Jumped!");});auto callbackRotate = CallFunc::create([]() {log("Rotate!");});auto seq = Sequence::create(jump, callbackJump, rotate, callbackRotate, nullptr);newSprite12->runAction(RepeatForever::create(seq));dirs->removeChildByName("runningMenu");auto runningMenu = MenuItemFont::create("Now at: Sequence");runningMenu->setPosition(200, 30);runningMenu->setName("runningMenu");runningMenu->setFontSizeObj(20);dirs->addChild(runningMenu);auto anode = dirs->getChildByName("menuNode");auto bnode = anode->getChildByName("menu");auto cnode = bnode->getChildByName("menuItem8");cnode->setVisible(false);cnode = bnode->getChildByName("menuItem9");cnode->setVisible(true);});auto menuItem9 = MenuItemFont::create("Spawn");menuItem9->setPosition(300, 400);menuItem9->setName("menuItem9");menuItem9->setVisible(false);menuItem9->setCallback([&](Ref *sender) {auto dirs = Director::getInstance()->getRunningScene();dirs->removeChildByName("sprite12");auto newSprite13 = Sprite::create("Blue_Front1.png");newSprite13->setPosition(400, 400);newSprite13->setName("sprite13");dirs->addChild(newSprite13, 1);// create a few actionsauto moveBy = MoveBy::create(10, Point(400, 10));auto fadeTo = FadeTo::create(2.0f, 120.0f);// running the above Actions with Spawnauto mySpawn = Spawn::createWithTwoActions(moveBy, fadeTo);newSprite13->runAction(mySpawn);dirs->removeChildByName("runningMenu");auto runningMenu = MenuItemFont::create("Now at: Spawn");runningMenu->setPosition(200, 30);runningMenu->setName("runningMenu");runningMenu->setFontSizeObj(20);dirs->addChild(runningMenu);auto anode = dirs->getChildByName("menuNode");auto bnode = anode->getChildByName("menu");auto cnode = bnode->getChildByName("menuItem9");cnode->setVisible(false);cnode = bnode->getChildByName("menuItem10");cnode->setVisible(true);});auto menuItem10 = MenuItemFont::create("Reverse");menuItem10->setName("menuItem10");menuItem10->setPosition(300, 400);menuItem10->setVisible(false);menuItem10->setCallback([&](Ref *sender) {auto dirs = Director::getInstance()->getRunningScene();dirs->removeChildByName("sprite13");auto newSprite14 = Sprite::create("Blue_Front1.png");newSprite14->setPosition(200, 400);newSprite14->setName("sprite14");dirs->addChild(newSprite14, 1);// create a sequenceauto moveBy = MoveBy::create(2.0f, Point(500, 0));auto scaleBy = ScaleBy::create(2.0f, 2.0f);auto delay = DelayTime::create(1.0f);auto delaySequence = Sequence::create(delay, delay->clone(),delay->clone(), delay->clone(), nullptr);auto sequence = Sequence::create(moveBy, delay, scaleBy,delaySequence, nullptr);newSprite14->runAction(sequence);newSprite14->runAction(sequence->reverse());dirs->removeChildByName("runningMenu");auto runningMenu = MenuItemFont::create("Now at: Reverse");runningMenu->setPosition(200, 30);runningMenu->setName("runningMenu");runningMenu->setFontSizeObj(20);dirs->addChild(runningMenu);});cocos2d::Vector<MenuItem *>menuItems;menuItems.pushBack(menuItem1);menuItems.pushBack(menuItem2);menuItems.pushBack(menuItem3);menuItems.pushBack(menuItem4);menuItems.pushBack(menuItem5);menuItems.pushBack(menuItem6);menuItems.pushBack(menuItem7);menuItems.pushBack(menuItem8);menuItems.pushBack(menuItem9);menuItems.pushBack(menuItem10);auto menu = Menu::createWithArray(menuItems);menu->setName("menu");menuNode->addChild(menu, 1);menu->setPosition(Vec2::ZERO);scene->addChild(menuNode, 2);return scene;}

运行过程中的某张图，下面的文字提示当前处于那个操作，上面文字提示点击进入下个操作。