cocos2d x公開課第六章

無腦碼農(nóng)（講解）龍靈修Cocos2d-x公開課2013-05-26《瓦磚地圖》聲明《cocos2d-x公開課》系列視頻為無腦碼農(nóng)和龍靈修合作錄制，二人共同享有此視的版權(quán)，此系列視頻可自由轉(zhuǎn)載和發(fā)布，但任何機(jī)構(gòu)和個(gè)人未經(jīng)許可不得用于盈利和商用。視頻地址：優(yōu)酷：（無腦碼農(nóng)）（龍靈修）百度網(wǎng)盤：教程使用開發(fā)環(huán)境Cocos2d-x

2.0.4蘋果系統(tǒng)xcode*本章目錄CONTENTS第6章在Cocos2D-x中使用瓷磚地圖瓷磚地圖瓷磚地圖的用途Tiled地圖編輯器用Tiled繪制俯視角度地圖在地圖中添加對象在項(xiàng)目中使用瓷磚地圖TMX文件解析Cocos2D-x中的瓷磚地圖類在項(xiàng)目中載入TMX地圖使用TMX地圖中的對象45°斜角瓷磚地圖

*****（下）斜角瓦磚地圖Tiled繪制斜角瓦磚地圖加載斜角瓦磚地圖定位斜角瓦磚地圖*6.1.1瓷磚地圖的用途什么是瓦磚地圖？瓦磚地圖也被稱為“瓦片地圖”。其原理是用小的瓷磚（tile）拼接出一張大的地圖。這樣做會大大節(jié)約內(nèi)存，大大提高OpenGL

ES的繪制渲染繪圖性能。很多游戲開發(fā)引擎都內(nèi)置了對瓦磚地圖的支持。瓦磚地圖的實(shí)現(xiàn)原理是什么？瓦磚地圖其實(shí)是二維數(shù)組，數(shù)組中的每一個(gè)元素都包含地圖中的特點(diǎn)區(qū)域的信息。此類信息包括該區(qū)域中所顯示的圖像、瓷磚的碰撞屬性等。瓦磚地圖能解決的實(shí)際問題？假如我們要設(shè)計(jì)一個(gè)大型的RPG地圖，瓷磚地圖就非常的有用。及時(shí)游戲不是很大，如果為了每個(gè)關(guān)卡創(chuàng)建不同的滾動(dòng)背景，也需要用到瓷磚地圖。舉例來說，在游戲中創(chuàng)建一個(gè)寬3200px、高3200px的背景，會遇到以下問題：1，OpenGL

ES對于紋理有限制，最大支持2048*2048像素2，需要從零開始創(chuàng)建每一個(gè)背景圖3，無法分別管理地圖中的不同部分4，如果地圖中有需要設(shè)定特定區(qū)域，必須手動(dòng)調(diào)整簡而言之，使用瓦磚地圖可以將大的地圖分成小的碎片，使用這些地圖碎片創(chuàng)建地圖可以節(jié)省大量內(nèi)存。使用瓦磚地圖，無須在程序中直接使用一個(gè)無比巨大的圖像，而是用很多小圖代替，就想鋪設(shè)地瓷磚一樣。*6.1.2

Tiled地圖編輯器TiledMapEditor地圖編輯器（以下簡稱Tiled）是一款免費(fèi)的通用瓷磚地圖編輯器，可以幫助創(chuàng)建各種基于瓦磚的游戲地圖。使用Tilde可以創(chuàng)建任意數(shù)量的層和瓷磚，并為這些層、瓷磚和其他對象設(shè)置特殊屬性。安裝Tiled官網(wǎng)地址：官網(wǎng)上提供了基于C++的Qt應(yīng)用框架開發(fā)的Tiled

Qt版本，以及Java版本的

Tiled。目前Java版本的Tiled沒有人專門更新和維護(hù)，所以建議直接下載TiledQt版本。Tiled特性1，支持正交地圖（俯視圖）2，支持等距地圖（45°斜視圖）3，支持精確放置的定制對象4，支持撤銷、重做、復(fù)制、粘貼命令5，可以為瓷磚、層、對象或地圖添加定制屬性6、可以縮放或移動(dòng)瓷磚地圖7、支持輸入\輸出插件*6.1.3用Tiled繪制俯視角度地圖1新建地圖文件新建2創(chuàng)建圖塊需要美工提供，Photoshop繪制或拼圖工具拼接小圖本講解圖片在百度網(wǎng)盤下載3添加圖塊地圖新圖塊 彈窗口中瀏覽邊距：Tiled在查找當(dāng)前瓦磚的真實(shí)像素值前，應(yīng)該忽略的像素值間距：Tiled中，從當(dāng)前瓦磚的真實(shí)像素到相鄰的瓦磚所需要間隔的像素4用瓦磚繪制地圖視圖顯示網(wǎng)格（繪制更準(zhǔn)確）5保持地圖*6.1.4在地圖中添加對象Tiled支持兩種層：瓦磚圖層和對象層

1，瓦磚圖層瓦磚圖層是充當(dāng)游戲背景的地圖。每個(gè)瓦磚圖層都會帶來額外的系統(tǒng)開銷，因此在游戲中使用的瓦磚圖層越少越好，一般不超過3個(gè)。在添加瓦磚層及地圖后，還需要在設(shè)備上進(jìn)行測試，以確保游戲的幀速保持正常。2，對象層對象層用來放置游戲中用到的各種對象。比如，使用對象層觸發(fā)某些事件，當(dāng)玩家角色進(jìn)入某個(gè)區(qū)域時(shí)，系統(tǒng)會自動(dòng)生成一些怪物；或者當(dāng)玩家角色進(jìn)入這些對象所在的區(qū)域時(shí)，會觸發(fā)一些特定的事件。*6.2.1

TMX文件解析使用Tiled生成的TMX文件其實(shí)是XML文件，這個(gè)XML文件包含一下信息：1，指定地圖的類型、寬度和高度以及瓷磚的寬度和高度2，設(shè)置圖塊的信息，包括圖塊名稱、瓷磚的寬度和高度、邊距和間距等。3，指定圖塊使用的圖片的路徑4，所建“普通層”的信息，如層的名字、寬度、高度<data></data>中間的長串字符代表著剛剛創(chuàng)建的瓦磚圖詳細(xì)信息。5，所建“對象層”的相關(guān)信息，如層的名字、寬度、高度、對象的名字，和對象所在的坐標(biāo)x、y*6.2.2

Cocos2D-x的瓷磚地圖類Cocos2d-x提供了5個(gè)類，分別是CCTileMapAtlas、CCTMXLayer、CCTMXObjectGroup、CCTMXTiledMap和CCTMXXMLParser。最常用的到的是CCTMXTiledMap、CCTMXLayer和CCTMXObjectGroup*CCTMXTiledMapCCTMXTiledMap主要的作用是解析和渲染TMX地圖，它是CCNode的子類。特性：每個(gè)瓦磚塊都可以當(dāng)做一個(gè)CCSprite來處理每個(gè)瓦磚的精靈，僅當(dāng)調(diào)用tileAt函數(shù)才會被創(chuàng)建每個(gè)瓦磚都可以旋轉(zhuǎn)、縮放、著色和調(diào)整透明度可以實(shí)時(shí)修改Z軸順序來改變遮擋關(guān)系。每個(gè)瓦磚的默認(rèn)錨點(diǎn)都是（0，0）瓦磚地圖的默認(rèn)錨點(diǎn)是（0，0）瓦磚可以擁有自己的屬性每個(gè)瓦磚都有單獨(dú)的z值，其中左上角的瓦磚為1，右下角的瓦磚z值最大每個(gè)圖素都可以有唯一的tag使用CCTextureCaChe來加載瓦磚圖片6.2.2

CCTMXTiledMapCCTMXTiledMap常用函數(shù)getMapSizesetMapSizegetTileSizesetTileSizegetObjectGroupsetObjectGroupgetPropertiessetPropertieslayerNamedobjectGroupNamedpropertyNamedpropertyForGID*獲得地圖的尺寸設(shè)置地圖的尺寸獲得瓷磚的尺寸設(shè)置瓷磚的尺寸獲得對象數(shù)組

設(shè)置對象數(shù)組

獲得對象屬性

設(shè)置對象屬性根據(jù)層的名字獲得地圖層

根據(jù)對象組名字獲得對象組根據(jù)屬性名獲得屬性值根據(jù)GID（Global

ID）獲得鍵值對集合*6.2.2

CCTMXLayerCCTMXLayerCCTMXLayer代表了TMX地圖中的層，它是CCSpriteBatchNode的子類。默認(rèn)情況下瓦磚會使用CCTextureAtlas進(jìn)行渲染。常用函數(shù)：getLayerSizesetLayerSizegetMapTileSizesetMapTileSizegetTileSetsetTileSetgetPropertiessetPropertiesreleaseMaptileAttileGIDAtsetTileGIDremoveTileAtpositionAtsetupTilespropertyNamed獲得地圖層尺寸設(shè)置地圖層尺寸獲得瓷磚尺寸

設(shè)置瓷磚尺寸

獲得瓦磚集合

設(shè)置瓦磚集合

獲得地圖屬性

設(shè)置地圖屬性

刪除地圖根據(jù)瓷磚橫縱坐標(biāo)索引獲得瓷磚精靈根據(jù)瓷磚橫縱坐標(biāo)索引獲得瓷磚的GID值設(shè)置瓷磚橫縱坐標(biāo)索引的GID根據(jù)瓷磚橫縱坐標(biāo)索引刪除瓷磚根據(jù)瓷磚橫縱坐標(biāo)索引獲取瓷磚位置創(chuàng)建瓦磚根據(jù)屬性名獲得屬性值6.2.2

CCTMXObjectGroupCCTMXObjectGroupCCTMXObjectGroup代表TMX地圖中的對象組常用函數(shù)：*getPositionOffsetsetPositionOffsetgetObjectssetObjectsgetGroupNamesetGroupNamegetPropertiessetPropertiesobjectNamedpropertyNamed獲得偏移位置設(shè)置偏移位置獲得對象數(shù)組設(shè)置對象數(shù)組獲取組名設(shè)置組名獲得屬性設(shè)置屬性根據(jù)對象名獲得鍵值對集合根據(jù)屬性名獲得屬性值6.2.3在項(xiàng)目中載入TMX地圖第一步：將.tmx文件和引用圖塊png導(dǎo)入項(xiàng)目中，并檢查xml內(nèi)路徑是否正確第二步：使用CCTMXTileMap將瓦磚地圖讀取到項(xiàng)目中CCTMXTileMap*map= CCTMXTiledMap::create(const

char*tmxFile);第三步：根據(jù)地圖層的名字獲得層對象CCTMXLayer*

layer

=

map->layerNamed(const

char

*layerName);第四步：根據(jù)索引坐標(biāo)獲得某個(gè)瓷磚對象CCSprite*

sprite

=

layer->tileAt(const

cocos2d::CCPoint&tileCoordinate)；*6.2.4使用TMX地圖中的對象第一步：將.tmx文件和引用圖塊png導(dǎo)入項(xiàng)目中，并檢查xml內(nèi)路徑是否正確第二步：使用CCTMXTileMap將瓦磚地圖讀取到項(xiàng)目中CCTMXTileMap*map= CCTMXTiledMap::create(const

char*tmxFile);第三步：根據(jù)對象層的名字獲得對象層CCTMXObjectGroup*

group

=

map->objectGroupNamed(const

char*layerName);第四步：獲得對象層上所有的對象