在瓷磚地圖游戲里，游戲圖形由叫做“瓷磚”（tiles）的一小組圖片相互排列組成。這些圖片被放置在一個網(wǎng)格中，得到的效果就是令人信服的游戲世界。瓷磚地圖的概念非常吸引人，因?yàn)槟憧梢怨?jié)省內(nèi)存而不必使用很多貼圖渲染整個世界，同時還可以有很多不同的組合。

?

本章將會使用最簡單的一種瓷磚地圖：90度角瓷磚地圖（Orthogonal?Tilemaps），介紹瓷磚地圖的一般概念。它們是用正方形或長方形的瓷磚組成的，通常以從上到下的視角展示游戲世界。

---

Tiled Map Editor（瓷磚地圖編輯器） 最出名的用于生成cocos2d-x中可用的瓷磚地圖的編輯器叫做 Tiled Map Editor（在此我簡稱它為 Tiled）。cocos2d-x游戲引擎原生支持 Tiled 生成的TMX文件。Tiled是免費(fèi)的，官方網(wǎng)站http://www.mapeditor.org/ 好像2.02的源碼中地圖加載模塊有問題 ?請?zhí)鎿Q ：點(diǎn)我下載?? 下載之后替換到cocos2dx下的tilemap_parallax_nodes里面的代碼刪除 ?解壓出來的代碼放入文件夾 要在cocos2d-x中使用TMX格式的瓷磚地圖，首先必須把TMX文件和它所引用的瓷磚集圖片文件作為資源添加到自己項(xiàng)目中。 在本例子中 ?我們將level1.tmx和tileSet.png加入到我們的項(xiàng)目中 ?? 素材下載：點(diǎn)我下載 在代碼里加載和顯示瓷磚地圖非常方便，以下代碼來自MainScene2類的init方法：?

CCTMXTiledMap?*map=CCTMXTiledMap::create("level1.tmx");?

this->addChild(map);?

CCTMXLayer?*tmxlayer=map->layerNamed("walls");?

tmxlayer->setVisible(false);?

CCTMXTiledMap類是用TMX文件名來初始化的，然后作為子節(jié)點(diǎn)被添加到當(dāng)前層中

下一步是通過使用tileMap的layerNamed方法和在Tiled中應(yīng)用過的層命名"walls"，來獲取CCTMXLayer（也就是之前在Tiled中添加的游戲事件層），我們通過第四行 ?可以將地圖中的磚塊層隱藏掉

好了 ? 運(yùn)行程序 我們可以在手機(jī)上看到 ?地圖已經(jīng)顯示了 ?但是你還不能去操作

接下來 我們需要判斷 ?是否按中了問號方塊

我們先將按下的坐標(biāo) ?轉(zhuǎn)換為tmx地圖的坐標(biāo)

CCPoint?MainScene2::tilePosFromLocation(CCPoint?touchpoint,?

????????CCTMXTiledMap?*map)?{?

????//?觸摸的屏幕坐標(biāo)必須減去瓷磚地圖的坐標(biāo)?－?萬一瓷磚地圖位置已經(jīng)不在（0，0）點(diǎn)上了?

????CCPoint?point?=?ccpSub(touchpoint,?map->getPosition());?

?

????//?將得到坐標(biāo)值轉(zhuǎn)換成整數(shù)?

????point.x?=?(int)?(point.x?/?map->getTileSize().width);?

????point.y?=?(int)?((map->getMapSize().height?*?map->getTileSize().height?

????????????-?point.y)?/?map->getTileSize().height);?

?

????return?point;?

}?

轉(zhuǎn)換后的坐標(biāo)就類似于 ? 如圖

void?MainScene2::ccTouchEnded(CCTouch?*pTouch,?CCEvent?*pEvent)?{?

?

????CCNode?*node?=?getChildByTag(TargetMap);?

????CCTMXTiledMap?*map?=?(CCTMXTiledMap*)?node;?

?

????CCPoint?touchpoint?=?CCDirector::sharedDirector()->convertToGL(?

????????????pTouch->getLocationInView());?

????CCPoint?mappoint?=?tilePosFromLocation(touchpoint,?map);?

????CCLog("mappoint.x=%f,mappoint.y=%f",?mappoint.x,?mappoint.y);?

?

????bool?isTouchOnWall?=?false;?

?

????CCTMXLayer?*maplayer?=?map->layerNamed("walls");?

????int?tileGID?=?maplayer->tileGIDAt(mappoint);?

?

????CCLog("tileGID=%i",?tileGID);?

????if?(tileGID?!=?0)?{?

????????CCDictionary?*properties?=?map->propertiesForGID(tileGID);?

????????if?(properties)?{?

????????????CCString?*isQuesWall?=?(CCString*)?(properties->objectForKey(?

????????????????????"isQues"));?

????????????isTouchOnWall?=?isQuesWall->boolValue()?==?true;?

????????}?

????}?

?

????CCLabelTTF?*label=(CCLabelTTF*)(getChildByTag(TargetLabel));?

????if(isTouchOnWall){?

????????label->setString("按下問號磚塊");?

????}else{?

????????label->setString("未按到問號磚塊");?

????}?

}?

首先 我們來解釋下上面的代碼

3-4行：通過tag 獲取CCTMXTiledMap節(jié)點(diǎn);

6行：獲取按下的坐標(biāo)點(diǎn) 并轉(zhuǎn)換為以左下角為原點(diǎn)的坐標(biāo);

8行：將按下的坐標(biāo) 轉(zhuǎn)換為tmx坐標(biāo)地圖

11行：用于存儲是否按到了問號磚塊

13行：獲取tmx地圖集中的walls層

14行：獲取按下坐標(biāo)所對應(yīng)的瓷磚的gid (利用CCTMXLayer的tileGIDAt方法，你可以獲取指定坐標(biāo)上瓷磚的GID編號。)

18行：CCTMXTiledMap有一個叫做propertiesForGID方法，如果指定GID編號的瓷磚附帶屬性的話，此方法會返回一個CCDictionary字典。這個NSDictionary字典包含了在Tiled中為瓷磚添加的屬性。字典的鍵/值都是用CCString對象存儲的。

? ?CCDictionary的每一個屬性都可以通過它的valueForKey方法來獲取，返回的是一個CCString對象。要從一個CCString對象中獲取布爾值，你可以使用CCString的boolValue方法；而要獲取整數(shù)或者浮點(diǎn)數(shù)，你可以使用CCString的intValue或者floatValue方法。

如果你需要在地圖上修改單個瓷磚，你可以使用removeTileAt和setTileGID這兩個方法。在游戲過程中，前者會移除指定層上的瓷磚，后者則會替換指定層上瓷磚:

maplayer->removeTileAt(mappoint);?

maplayer->setTileGID(tileGID,mappoint);?

-------------------------

map->getTileSize()：當(dāng)個瓷磚的大小

map->getMapSize()：指橫豎瓷磚的塊數(shù)

---

滾動瓷磚地圖

?實(shí)際上我們可以很輕松的實(shí)現(xiàn)地圖的滾動，因?yàn)槲覀冎恍枰孋CTMXTiledMap移動就可以了。

---

以后基本都是講解實(shí)例 一個Demo寫完之后就寫一個教程，前兩天接了個項(xiàng)目，所以沒怎么研究cc2dx

?

本教程根據(jù)Cocos2d教程翻譯過來

使用的cocos2d-x版本為2.02

轉(zhuǎn)載于:https://blog.51cto.com/gejw0623/1009574

總結(jié)

以上是生活随笔為你收集整理的【cocos2d-x】瓷砖地图(TileMap)基础知识的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。