使用图块地图(Tile Maps)

简介

图块地图是用于创建游戏布局的图块网格。使用 TileMap 节点设计关卡有很多好处。首先,它们可以通过将图块“绘制”到网格上来绘制布局,这比逐个放置单个 Sprite 节点快得多;其次,它们允许更大的关卡。最后,您可以为图块添加碰撞,遮挡和导航形状,从而为图块地图添加其他功能。

../../_images/tileset_draw_atlas.png

项目设置

在这个Demo中,我们将使用Kenney的”Abstract Platformer”艺术包中的以下图块。您可以在 此处 找到完整的包,但是对于本演示,我们将仅使用这一小部分。

../../_images/tilesheet.png

创建一个新项目并将上面的图像放置在项目文件夹中。

使用图块集时,相邻的图块匹配很重要。 Godot的默认设置是使用插值的“滤镜(Filter)”模式导入2D图像,这将导致图块之间的边界很丑。选择图像,然后单击”导入(Import)”选项卡。关闭``Filter``,然后单击“重新导入”。有关详细信息,请参见 导入图像

TileMap节点

在场景中添加一个新的TileMap <class_TileMap>节点。默认情况下,TileMap使用正方形的图块网格。您还可以使用基于透视图的“Isometric”模式或定义自己的自定义图块形状。

../../_images/tilemap_mode.png

在属性面板的“Cell”部分下,有许多属性可以调整, 自定义图块贴图的行为:

../../_images/tilemap_size.png
  • Cell Size
    这定义了网格的大小。这应与您的图块的像素大小匹配。默认值为``(64,64)’‘。
  • YSort
    这将导致以“ Y”(竖直方向)位置的顺序绘制图块,这样的话“较低”图块的绘制覆盖在“较高”图块的上面。
  • Half OffsetTile Origin
    这些属性影响图块相对于网格的位置。
  • Quadrant
    定义用于批处理绘图的块大小。这可能会对性能产生负面影响。除非你知道你在做什么,否则不要改变它。
  • Custom Transform
    用来改变图块的形状。如果您有非正方形的图块,请使用此选项。

在这个演示中,所有这些选项都可以保持默认值。

创建一个TileSet

一旦你配置好你的TileMap,是时候添加一个 TileSet 了。TileSet是一个 Resource ,它包含了图块的所有数据——纹理,碰撞形状(Collision Shape)和其他属性。当游戏运行时,TileMap 将独立的图块合并成一个对象。

若要添加新TileSet,请单击“Tile Set”属性并选择“新建 TileSet(New TileSet)”。

../../_images/tilemap_add_tileset.png

当你这么做的时候你会看到一个”TileSet(瓦片集)”面板出现在编辑器窗口的底部:

../../_images/tilemap_tool.png

首先,您需要添加用于砖块的纹理。点击“Add Texture(s) to TileSet(添加纹理到磁贴集)”按钮,选择``tileshev et.png``的图片。

接下来,点击“New Single Tile(新建图块)”,在图像中拖动来选择你想要的图块。单击“Enable Snap(启用吸附)”按钮可以更容易地选择整个砖块。一个黄色矩形会出现在选定的图块区域周围。

../../_images/tilemap_add_tile.png

单击场景树中的TileMap,你会看到新创建的图块现在出现在右侧。单击视窗,你就可以放置图块。右键单击以删除它们。

../../_images/tilemap_draw.png

很容易发生意外地选择和移动TileMap节点的情况。为了避免这种情况,使用节点的锁定按钮:

../../_images/tile_lock.png

Collision Shapes(碰撞形状)

如果你在制作需要碰撞体积的地图——墙壁,地板,或其他障碍——你需要添加collision shape到任何你想被认为是“实心的”图块上。

单击编辑器窗口底部的“瓦片集”返回到瓦片集工具。单击之前定义的砖块(用黄色表示)。选择“Collision”标签并点击“新建一个四边形”按钮。确保你网格对齐还开着,然后单击并拖动砖块。会出现淡蓝色的矩形碰撞框:

../../_images/tileset_add_collision.png

你也可以以相同的方式向图块添加occlusion shapes(光线遮挡形状)和navigation shapes(导航形状)。

Atlas Tiles(图块组)

与其一次添加一个图块,您可以使用图块组(Atlas Tiles)一次性定义一组图块。单击“New Atlas”并拖动以选择整张图块清单(tile sheet)。

../../_images/tileset_atlas.png

如果你还没有设置,请确保将Snap Options中的“Step”更改为“(64,64)” 或者别的适合你图块的大小。你可以在属性面板中找到它:

../../_images/tileset_snap.png

一旦你定义了图块组,你就可以像以前一样将碰撞形状(Collision Shape)添加到各个图块上。你也可以点击“Icon”来选择其中一个作为整个图块组的图标。

回到TileMap,你可以选择图块组,你会看到它所包含的所有图块:

../../_images/tileset_draw_atlas.png

除了节省定义图块的时间外,这可以帮助你在处理大量图块时将类似的图块分组在一起。

提示和技巧

  • 如果你使用 Camera2D 来滚动显示你的关卡,则可能会注意到在图块之间出现了一些线条。要解决此问题,请打开“项目设置”,然后在“Rendering/Quality(渲染/质量)”部分中启用“Use Pixel Snap”。
  • 您可以使用编辑器右上方的图标来翻转和旋转图块。
  • To draw straight lines, hold Shift while clicking and dragging a tile.
  • 可以在右上角的“ TileMap”菜单中找到诸如复制,粘贴和油漆桶填充之类的工具。
../../_images/tilemap_menu.png