Cocos2d中的Menu使用

學(xué)習(xí)cocos2d-x中的菜單主要需要了解：菜單(CCMenu)和菜單項(xiàng)(CCMenuItem)以及CCMenuItem的具體子類。
a. 下面來學(xué)習(xí)一下相關(guān)的類。
1. CCMenu
菜單，是CCLayer的子類，是一個(gè)層(容器)，可以往里面添加菜單項(xiàng)。下面是它的類結(jié)構(gòu)圖：

CCMenu默認(rèn)接受觸屏事件的優(yōu)先級(jí)是-128(優(yōu)先級(jí)很高，因?yàn)?#20540;越小，響應(yīng)觸屏事件的優(yōu)先級(jí)越高)，可以通過繼承它實(shí)現(xiàn)自定義的效果，創(chuàng)建CCMenu對(duì)象的函數(shù)：

2. CCMenuItem
菜單項(xiàng)，開發(fā)中一般是直接使用它的子類。CCMenuItem有三個(gè)直接子類：
CCMenuItemLabel(字符標(biāo)簽菜單)、CCMenuItemSprite(圖片菜單)、CCMenuItemToggle(開關(guān)菜單)。
下面是CCMenuItem的類結(jié)構(gòu)圖：

現(xiàn)在分別來了解一下各個(gè)不同的菜單項(xiàng)。
(1) CCMenuItemLabel：使用文字標(biāo)簽創(chuàng)建菜單項(xiàng)
所有支持CCLabelProtocol的節(jié)點(diǎn)都可以用來創(chuàng)建CCMenuItemLabel，CCLabelProtocol是標(biāo)簽的共同接口。CCLabelProtocol也有三個(gè)直接子類，下面是類結(jié)構(gòu)圖：

CCLabelTTF：同時(shí)也是CCSprite的子類，用來渲染文字標(biāo)簽的，可以指定字體，每次設(shè)置字符串內(nèi)容時(shí)都需要重新創(chuàng)建紋理和渲染，性能不好，可以看它的相關(guān)源碼：

void CCLabelTTF::setString(const char *label) { if (m_pString) { delete m_pString; m_pString = NULL; } m_pString = new std::string(label); CCTexture2D *texture; if( CCSize::CCSizeEqualToSize( m_tDimensions, CCSizeZero ) ) { texture = new CCTexture2D(); texture->initWithString(label, m_pFontName->c_str(), m_fFontSize); } else { texture = new CCTexture2D(); texture->initWithString(label, m_tDimensions, m_eAlignment, m_pFontName->c_str(), m_fFontSize); } this->setTexture(texture); texture->release(); CCRect rect = CCRectZero; rect.size = m_pobTexture->getContentSize(); this->setTextureRect(rect); }

可以用CCLabelBMFont或者CCLabelAtlas代替它。
CCLabelBMFont：也是CCSpriteBatchNode的子類，創(chuàng)建CCLabelBMFont對(duì)象需要一個(gè)字符串和一個(gè)fnt格式的文件(字庫)，如：

這個(gè)fnt文件包含了這些信息：對(duì)應(yīng)圖片的名字(圖片包含了所有你要繪制的字符)、圖片中的字符對(duì)應(yīng)的unicode編碼、字符在圖片中的坐標(biāo)、寬高等。初始化CCLabelBMFont對(duì)象時(shí)，會(huì)把圖片添加到緩存(CCTextureCache)中，解析fnt文件，把fnt文件中對(duì)應(yīng)的信息保存到一個(gè)ccBMFontDef類型的數(shù)組里面，數(shù)組的索引是charId(字符的unicode編碼值)，ccBMFontDef是一個(gè)結(jié)構(gòu)體：

typedef struct _BMFontDef { //! ID of the character unsigned int charID; //! origin and size of the font CCRect rect; //! The X amount the image should be offset when drawing the image (in pixels) int xOffset; //! The Y amount the image should be offset when drawing the image (in pixels) int yOffset; //! The amount to move the current position after drawing the character (in pixels) int xAdvance; } ccBMFontDef;

繪制字符串時(shí)，根據(jù)字符對(duì)應(yīng)的unicode碼去查找ccBMFontDef信息，從緩存中取出圖片，再根據(jù)ccBMFontDef中坐標(biāo)、寬高取出對(duì)應(yīng)區(qū)域的字符圖片，把字符在字符串中的索引位置作為tag添加到CCLabelBMFont中，因?yàn)镃CLabelBMFont本身是CCSpriteBatchNode，這樣就實(shí)現(xiàn)了批處理渲染精靈，提高了性能。下面是創(chuàng)建字符對(duì)應(yīng)的CCSprite的部分代碼：

void CCLabelBMFont::createFontChars() { /** .... */ //以下代碼是遍歷字符串時(shí)：for循環(huán)內(nèi)的代碼 const ccBMFontDef& fontDef = (*(m_pConfiguration->m_pBitmapFontArray))[c]; CCRect rect = fontDef.rect; CCSprite *fontChar; fontChar = (CCSprite*)(this->getChildByTag(i)); if( ! fontChar ) { fontChar = new CCSprite(); fontChar->initWithBatchNodeRectInPixels(this, rect); this->addChild(fontChar, 0, i); fontChar->release(); } else { // reusing fonts fontChar->setTextureRectInPixels(rect, false, rect.size); // restore to default in case they were modified fontChar->setIsVisible(true); fontChar->setOpacity(255); } /** .... */ }

CCLabelAtlas：也是CCAtlasNode的子類，創(chuàng)建一個(gè)CCLabelAtlas對(duì)象的代碼如下：

參數(shù)的含義：要繪制的字符，圖片文件，圖片文件中每個(gè)字符的寬度，圖片文件中每個(gè)字符的高度，圖片的起始字符。
CCAtlasNode封裝了一個(gè)CCTextureAtlas的變量，CCTextureAtlas初始化圖片文件的時(shí)候會(huì)把圖片加載到緩存(CCTextureCache)中：

bool CCTextureAtlas::initWithFile(const char * file, unsigned int capacity) { // retained in property CCTexture2D *texture = CCTextureCache::sharedTextureCache()->addImage(file); if (texture) { return initWithTexture(texture, capacity); } else { CCLOG("cocos2d: Could not open file: %s", file); delete this; return NULL; } }

接下來CCTextureAtlas負(fù)責(zé)管理該大圖，可以隨意繪制圖片的某一矩形區(qū)域，渲染方式采用的是OpenGL ES VBO(頂點(diǎn)緩沖對(duì)象，保存在顯存中)。 CCTextureAtlas有一個(gè)m_pQuads屬性，它是CCTextureAtlas類的核心，是一個(gè)ccV3F_C4B_T2F_Quad類型的數(shù)組，ccV3F_C4B_T2F_Quad是一個(gè)結(jié)構(gòu)體，有四個(gè)成員屬性，它們都是ccV3F_C4B_T2F類，分別表示左上，左下，右上，右下?？丛创a：

//! a Point with a vertex point, a tex coord point and a color 4B typedef struct _ccV3F_C4B_T2F { //! vertices (3F) ccVertex3F vertices; // 12 bytes // char __padding__[4]; //! colors (4B) ccColor4B colors; // 4 bytes // char __padding2__[4]; // tex coords (2F) ccTex2F texCoords; // 8 byts } ccV3F_C4B_T2F; //! 4 ccVertex2FTex2FColor4B Quad typedef struct _ccV2F_C4B_T2F_Quad { //! bottom left ccV2F_C4B_T2F bl; //! bottom right ccV2F_C4B_T2F br; //! top left ccV2F_C4B_T2F tl; //! top right ccV2F_C4B_T2F tr; } ccV2F_C4B_T2F_Quad;

ccV3F_C4B_T2F有三個(gè)成員，分別表示：頂點(diǎn)、顏色、紋理坐標(biāo)。
CCTextureAtlas類就是根據(jù)這個(gè)數(shù)組來繪制矩形的，數(shù)組的容量就是要繪制的字符數(shù)量。指定字符串的時(shí)候：是根據(jù)指定字符的ASCII碼值跟startCharMap(圖片起始字符)ASCII碼值的偏移量，得到該字符在圖片上的區(qū)域的，然后生成繪制矩形所需要的數(shù)據(jù)，源碼：

//CCLabelAtlas - CCLabelProtocol void CCLabelAtlas::setString(const char *label) { /** .... */ this->updateAtlasValues(); /** .... */ } //CCLabelAtlas - Atlas generation void CCLabelAtlas::updateAtlasValues() { unsigned int n = m_sString.length(); ccV3F_C4B_T2F_Quad quad; const unsigned char *s = (unsigned char*)m_sString.c_str(); CCTexture2D *texture = m_pTextureAtlas->getTexture(); float textureWide = (float) texture->getPixelsWide(); float textureHigh = (float) texture->getPixelsHigh(); for(unsigned int i = 0; i < n; i++) { unsigned char a = s[i] - m_cMapStartChar; float row = (float) (a % m_uItemsPerRow); float col = (float) (a / m_uItemsPerRow); #if CC_FIX_ARTIFACTS_BY_STRECHING_TEXEL // Issue #938. Don't use texStepX & texStepY float left = (2 * row * m_uItemWidth + 1) / (2 * textureWide); float right = left + (m_uItemWidth * 2 - 2) / (2 * textureWide); float top = (2 * col * m_uItemHeight + 1) / (2 * textureHigh); float bottom = top + (m_uItemHeight * 2 - 2) / (2 * textureHigh); #else float left = row * m_uItemWidth / textureWide; float right = left + m_uItemWidth / textureWide; float top = col * m_uItemHeight / textureHigh; float bottom = top + m_uItemHeight / textureHigh; #endif // ! CC_FIX_ARTIFACTS_BY_STRECHING_TEXEL quad.tl.texCoords.u = left; quad.tl.texCoords.v = top; quad.tr.texCoords.u = right; quad.tr.texCoords.v = top; quad.bl.texCoords.u = left; quad.bl.texCoords.v = bottom; quad.br.texCoords.u = right; quad.br.texCoords.v = bottom; quad.bl.vertices.x = (float) (i * m_uItemWidth); quad.bl.vertices.y = 0; quad.bl.vertices.z = 0.0f; quad.br.vertices.x = (float)(i * m_uItemWidth + m_uItemWidth); quad.br.vertices.y = 0; quad.br.vertices.z = 0.0f; quad.tl.vertices.x = (float)(i * m_uItemWidth); quad.tl.vertices.y = (float)(m_uItemHeight); quad.tl.vertices.z = 0.0f; quad.tr.vertices.x = (float)(i * m_uItemWidth + m_uItemWidth); quad.tr.vertices.y = (float)(m_uItemHeight); quad.tr.vertices.z = 0.0f; m_pTextureAtlas->updateQuad(&quad, i); } }

生活不易，碼農(nóng)辛苦
如果您覺得本網(wǎng)站對(duì)您的學(xué)習(xí)有所幫助,可以手機(jī)掃描二維碼進(jìn)行捐贈(zèng)