CCMenu的佈局

摘自：http://blog.csdn.net/jackystudio/article/details/12904705

前兩天寫個遊戲，發現CCMenu的佈局還是比較有意思的，這裏總結一下，以便後用。

1.概況

CCMenu是cocos2d-x的菜單類，但它本身並不具備菜單具體屬性，而是作爲一個父節點，將一些具體類型的菜單添加進去來達到菜單目的的。我們正常會這麼使用它：先創建子菜單項CCMenuItem，然後將子菜單項CCMenuItem加入菜單CCMenu，最後把CCMenu加入當前層CCLayer。

如果直接在層中添加CCMenuItem會怎樣？其實顯示也是會正常，但是無法響應回調，因爲CCMenu是繼承至CCLayer，也就繼承了觸摸的相關事件，而CCMenuItem只是從CCNode繼承而來，並不響應觸摸，因此無法調用回調函數。

2.菜單CCMenu

3.子菜單項CCMenuItem

子菜單項可以是用精靈，圖片，標籤文本，或者開關都可以，這裏不具體解釋。請看：

4.錨點

CCMenu繼承於CCLayer，所以它具有忽略錨點的屬性。而CCMenuItem的錨點是正常的(0.5,0.5)。

（1）看一下自帶的HelloCpp這個工程，在添加退出按鈕的時候，是不是有這麼一句：

pMenu->setPosition(CCPointZero);

這句話的作用就是把Menu放在原點的位置，假設Menu有大小，那就是下圖1。

（2）現在再做點改變，把MenuItem指定的位置去掉，也就是讓它默認在(0,0)位置上。

//pCloseItem->setPosition(ccp(origin.x + visibleSize.width - pCloseItem->getContentSize().width/2 ,origin.y + pCloseItem->getContentSize().height/2));

那麼再看一下效果，如圖2，抽象出來就是圖3，因爲CCMenuItem的錨點是(0.5,0.5)。

            

（3）所以現在可以理解HelloCpp中爲什麼定義的是CCMenuItem的位置，而不是定義CCMenu的位置了吧。CCMenu包含了多個子菜單項，每個子菜單的位置都不一樣，如果定義了CCMenu的位置，那它作爲父節點會影響到所有的子菜單的位置，因此我們一般把它設置在原點處，然後通過設置子菜單的位置（也就是相對父節點的偏移量）來定位整個菜單。

5.多子菜單的排列

（1）橫向排列，縱向排列，可以指定間隔

CCMenuItemImage *pCloseItem1 = CCMenuItemImage::create(
    "CloseNormal.png",
    "CloseSelected.png",
    this,
    menu_selector(HelloWorld::menuCloseCallback));
CCMenuItemImage *pCloseItem2 = CCMenuItemImage::create(
    "CloseNormal.png",
    "CloseSelected.png",
    this,
    menu_selector(HelloWorld::menuCloseCallback));

CCMenu* pMenu = CCMenu::create(pCloseItem1,pCloseItem2,NULL);
pMenu->alignItemsHorizontally();//默認間隔是kDefaultPadding=5
//pMenu->alignItemsHorizontallyWithPadding(20);//指定間隔
//pMenu->alignItemsVertically();//默認間隔也是kDefaultPadding=5
//pMenu->alignItemsVerticallyWithPadding(20);//指定間隔
this->addChild(pMenu, 1);

（2）按行排列，按列排列，不能指定間隔，只能自己實現。希望下一版本有這個功能。

CCMenuItemImage *pCloseItem1 = CCMenuItemImage::create(
    "CloseNormal.png",
    "CloseSelected.png",
    this,
    menu_selector(HelloWorld::menuCloseCallback));
...
CCMenuItemImage *pCloseItem6 = CCMenuItemImage::create(
    "CloseNormal.png",
    "CloseSelected.png",
    this,
    menu_selector(HelloWorld::menuCloseCallback));
CCMenu* pMenu = CCMenu::create(pCloseItem1,pCloseItem2,pCloseItem3,pCloseItem4,pCloseItem5,pCloseItem6,NULL);
pMenu->alignItemsInRows(3,2,1,NULL);
//pMenu->alignItemsInColumns(3,2,1,NULL);
this->addChild(pMenu, 1);