在瓷磚地圖游戲里，游戲圖形由叫做“瓷磚”（tiles）的一小組圖片相互排列組成。這些圖片被放置在一個網格中，得到的效果就是令人信服的游戲世界。瓷磚地圖的概念非常吸引人，因為你可以節省內存而不必使用很多貼圖渲染整個世界，同時還可以有很多不同的組合。

?

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

---

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

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

this->addChild(map);?

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

tmxlayer->setVisible(false);?

CCTMXTiledMap類是用TMX文件名來初始化的，然后作為子節點被添加到當前層中

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

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

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

我們先將按下的坐標 ?轉換為tmx地圖的坐標

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

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

????//?觸摸的屏幕坐標必須減去瓷磚地圖的坐標?－?萬一瓷磚地圖位置已經不在（0，0）點上了?

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

?

????//?將得到坐標值轉換成整數?

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

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

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

?

????return?point;?

}?

轉換后的坐標就類似于 ? 如圖

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節點;

6行：獲取按下的坐標點 并轉換為以左下角為原點的坐標;

8行：將按下的坐標 轉換為tmx坐標地圖

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

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

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

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

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

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

maplayer->removeTileAt(mappoint);?

maplayer->setTileGID(tileGID,mappoint);?

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

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

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

---

滾動瓷磚地圖

?實際上我們可以很輕松的實現地圖的滾動，因為我們只需要讓CCTMXTiledMap移動就可以了。

---

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

?

本教程根據Cocos2d教程翻譯過來

使用的cocos2d-x版本為2.02

轉載于:https://blog.51cto.com/gejw0623/1009574

總結

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

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。