【CocosCreator入门】CocosCreator组件 | TiledTile（地图块）组件

• 博客主页：肩匣与橘
• 欢迎点赞 收藏 ⭐留言 如有错误敬请指正！
• 本文由肩匣与橘编写，首发于CSDN
• 生活依旧是美好而又温柔的，你也是✨ 

Cocos Creator 小科普

• Cocos Creator是一个基于 Cocos2d-x 引擎的游戏开发工具，可以用于制作2D和3D游戏，也可以用于开发跨平台应用程序。
• Cocos Creator提供了一系列的工具和编辑器，可以帮助开发者快速地创建游戏场景、设计游戏逻辑、调试游戏性能等。
• Cocos Creator支持多平台发布，包括Web、iOS、Android、Windows、Mac等平台，可以帮助开发者快速地发布游戏并将其推向全球市场。
• Cocos Creator提供了丰富的社区资源和技术支持，可以帮助开发者解决开发过程中遇到的各种问题。

---

       Cocos Creator是一款流行的游戏开发引擎，具有丰富的组件和工具，其中TiledTile组件是用于在TiledMap地图中显示瓦片的组件，可以帮助开发者更方便地渲染地图。

---

目录

一、组件介绍

二、组件属性

三、创建方式

3.1通过编辑器创建

3.2通过代码创建

四、组件使用

---

一、组件介绍

TiledTile组件是基于TiledMap地图和TMX文件格式实现的。在TMX文件中，每个图层都由若干个瓦片组成，每个瓦片都有自己的位置和属性。TiledMap地图会根据TMX文件中的信息来加载瓦片，并将瓦片渲染到画布上。 TiledTile组件会根据TMX文件中指定的瓦片图集来加载瓦片图像，并将瓦片图像渲染到画布上。同时，TiledTile组件还可以通过设置一些属性，例如瓦片的位置、旋转角度、缩放比例等，来调整瓦片的显示效果。

二、组件属性

属性	功能说明
X	指定 TiledTile 的横向坐标，以地图块为单位
Y	指定 TiledTile 的纵向坐标，以地图块为单位
Gid	指定 TiledTile 的 gid 值，来切换 TiledTile 的样式
Layer	获取 TiledTile 属于哪一个 TiledLayer (从 v2.0.1 开始移除该属性 )

三、创建方式

3.1通过编辑器创建

       在创建 TiledTile组件过程中 自动生成 的 Layer 节点下创建一个空节点。然后选中该空节点，点击 属性检查器 下方的 添加组件 -> 渲染组件 -> TiledTile，即可添加 TiledTile 组件到节点上。再通过设置 TiledTile 组件上的属性来操作地图块。

3.2通过代码创建

       在代码中设置地图块有两种方式。当你在某个 Layer 节点中设置了 TiledTile 之后，该 Layer 节点原先所在位置的 TiledTile 将会被取代。

       通过对一个节点添加 TiledTile 组件创建

// 创建一个新节点
var node = new cc.Node();
// 然后把该节点的父节点设置为任意的 layer 节点
node.parent = this.layer.node;  
// 最后添加 TiledTile 组件到该节点上，并返回 TiledTile 对象，就可以对 TiledTile 对象进行一系列操作
var tiledTile = node.addComponent(cc.TiledTile);

       通过 getTiledTileAt 获取 TiledTile

// 获取 layer 上横向坐标为 0，纵向坐标为 0 的 TiledTile 对象，就可以对 TiledTile 对象进行一系列操作
var tiledTile = this.layer.getTiledTileAt(0, 0);

四、组件使用

       在使用TiledTile组件时，需要先将该组件添加到一个节点上，然后设置该节点的一些属性，例如：

var tile = node.addComponent(cc.TiledTile);
tile.tiledId = 1;
tile.tileSet = tiledMap.getTileSet('tileset1');
tile.flipX = true;

       在上述代码中，首先将TiledTile组件添加到名为node的节点上，然后设置该组件的tiledId属性为1，表示该瓦片在TMX文件中的ID为1。接着，设置该组件的tileSet属性为名为tileset1的瓦片图集对象。最后，将该组件的flipX属性设置为true，表示该瓦片需要水平翻转。

       除了上述属性外，TiledTile组件还提供了其他一些属性，例如：

• tiledId: 瓦片在TMX文件中的ID。
• tileSet: 瓦片所属的瓦片图集对象。
• position: 瓦片的位置。
• rotation: 瓦片的旋转角度。
• scale: 瓦片的缩放比例。
• flipX: 是否水平翻转。
• flipY: 是否垂直翻转。

---

       总之，TiledTile组件是Cocos Creator中用于显示瓦片的组件，底层基于TiledMap地图和TMX文件格式实现。在使用TiledTile组件时，需要先将该组件添加到一个节点上，然后设置该节点的一些属性，例如瓦片的ID、瓦片图集对象、位置、旋转角度等。除此之外，还可以通过设置其他属性来调整瓦片的显示效果。