让我们通过制作 RPG 来学习 Godot 4 — 第 4 部分：游戏图块地图和相机设置
欢迎回到我们的Dusty Trails教程系列！如果您错过了上一部分，您可以在本教程末尾找到它的链接。
我们现在有了一个正常运行的玩家，好吧，我们还有很多东西可以添加到我们的小人物身上，使他们成为真正的游戏英雄！但现在，我们的玩家必须等待，因为在这一部分中，我们将添加带有碰撞的游戏TileMap，并添加一个Camera2D到我们的游戏中，以便我们可以跟随玩家。我们没有在本教程的播放器设置部分添加相机节点，因为相机节点在没有某种背景（即我们的图块地图）的情况下无法工作。
您将在本部分中学到什么：
· 如何使用 TileMap 节点的精灵表。
· 如何使用 TileMap 和 TileSheet 面板。
· 如何使用 TileMap 工具将图块绘制到地图上。
· 如何创建图块地图图层以及物理和地形图层。
· 如何向您的播放器添加摄像头。
首先，什么是瓦片地图或瓦片集？图块地图是用称为图块的小型规则形状图像构建游戏世界或关卡地图的基础。这些图块存储在我们称为图集、图块集或精灵表的东西中，我们之前在添加动画时已经见过它们。换句话说，图块集是图块地图的实际图形。
TileMap 和 TileSet 有什么区别？
TileMap 是一个网格，您可以在其中放置 Tileset 中的图块以实际构建关卡。图块集是可用于构建关卡的图块集合。
图 1：TileSet（左）和 TileMap（右）
在我们的主场景中，我们可以添加一个 TileMap 类型的新节点。单击并拖动该节点，使其位于我们的玩家场景后面，否则，玩家将被我们的地图隐藏！
我们将此节点重命名为 Map，然后在 Inspector 面板中单击 TileSet 旁边的 
您将看到下面弹出两个新选项：TileMap和TileSet。
要创建 TileMap（这是我们将在屏幕上绘制的地图），我们首先需要为其分配一个 TileSet（这是我们将从中绘制的图像）。为此，请单击 TileSet 选项，然后在文件系统面板中打开资源文件夹。您会看到我给了您三个图块集：Interior、Water 和 Atlas。我们将使用这些图块来创建我们的世界。
您可以将这些图块表拖到 TileSet 面板中的“图块”选项中。
会弹出一个窗口询问您是否希望引擎自动创建图块。选择“是”，因为这会将我们的图像分成漂亮的方块以形成网格。
您现在可以更改图块表名称、ID 和网格分隔值。更改您的姓名和 ID，如下所示：
现在，如果我们返回到 TileMap 面板，我们可以看到我们的图块已添加。现在，您可以单击图块并开始在屏幕上绘制图像。
以下是 TileMaps 面板中提供的工具的简要概述：
一部分可能有点令人困惑，所以我将尝试将其分解成几个部分，以便您更好地理解这些概念。如果事情对您来说有点复杂，请下载我创建的地图场景，并将地图节点从场景拖入主场景。
地图创建
1. 地形图层介绍（自动平铺）
我们可以使用提供的绘画工具绘制或创建地图，但我们的环境看起来会很单调，尤其是对于我们的地形而言。为了让事情变得更容易，我们可以使用一种称为autotiles的东西。
地形（也称为自动图块）可创建有机地形形状，并自动绘制我们指定区域的角落和边缘。这消除了手动放置草地或水体边缘和侧面的繁琐工作，同时让我们尝试自己创建有趣的地形。
要创建自动图块，只需转到“检查器”面板，单击“TileSet”资源（带有图像的资源），然后在“地形集”下添加一个地形集元素。请记住还要向地形集元素添加一个元素。
您可以为不同的地形元素创建不同的地形集。例如，您可以将草地自动图块放在一组中，将泥土自动图块放在另一组中，依此类推。
让我们为草地、沙子和水创建地形元素。您将从下图中看到，我有一个 Sand_Dessert 和一个 Sand_Forest。这只是为了向您展示您可以在一个地形元素集中拥有多个沙子。在我的例子中，草地、沙子和水都在不同的集合中，但沙子元素在同一个集合中。
2. TileMap 图层
趁此机会，我们还要创建图层，以便我们可以在不同的图层上绘制这些元素，这样它们就可以重叠。如果我们在同一层上绘制，这些图块就会相互擦除。
要添加新图层，只需进入“检查器”面板，然后在“图层”属性下方添加一个新图层元素即可。让我们为每个地形集添加一个：水、草和沙。
3. 地形图层创建（自动平铺）
现在我们可以分别在图层上绘画。但首先，让我们创建这些自动图块。在您的 Tileset 面板顶部，您将看到三个选项：设置、选择和绘画。
在设置中，我们已经看到，我们可以在这里更改图块集的名称和 ID。在选择面板中，从 TileMap 属性中添加图层（例如地形或物理图层）后，我们可以更改图块的属性，即通过选择然后更改图块组来添加碰撞或自动平铺。在绘制面板中，我们可以执行与选择面板中相同的操作，但这次我们可以将这些属性绘制到图块上，即一次将碰撞绘制到多个图块上。
图 8：TileSet 模式概览
a. 在选择面板中自动平铺
请记住，选择面板仅允许我们选择单个或多个图块，然后通过属性面板更改它们的属性。
您将看到我们的 Terrains 属性有两个数值：-1 表示 Terrain 集，-1 表示 Terrain。这指的是我们的地形集和地形元素的 ID。-1 表示“无地形集”或“无地形”（它将擦除地形），这意味着您必须将 Terrain 集设置为 0 或更大，然后才能将 Terrain 设置为 0 或更大。
对于地形，我们有三组地形，一组用于沙地、水和草地。在每个地形组中，我们都有地形元素。对于沙地地形组，我们有 Sand_Dessert 地形元素和 Sand_Forest 地形元素。对于水地形组，我们只有水地形元素。对于草地地形组，我们只有草地地形元素。我希望这是合理的，因为它可能有点令人困惑或不知所措。
对于我们的地形层，我们的元素将按如下方式关联：
让我们将自动图块添加到地形集 0（沙地）、地形元素 0（Sand_Dessert）中。我们将为此使用 Atlas.png 图块集。现在我们可以继续选择沙地图块。我将选择左上角的图块。
现在，我们必须为这些图块分配位对等值。对等位根据相邻图块确定将放置哪个图块。-1 是一个特殊值，表示空白空间。
例如，如果某个图块的所有位都设置为 0 或更大，则只有当其所有相邻图块都使用具有相同地形 ID 的图块时，它才会出现。如果某个图块的位都设置为 0 或更大，但左上角、顶部和右上角的位都设置为 -1，则只有当其上方有空白空间（包括对角线）时，它才会出现。
当我们分配这个值时，我们要避免将值分配给明显的角落或尖锐的边缘。
如果我们回到 TileMaps 面板，在 Sand_Dessert 地形元素下方，我们现在可以将新创建的自动图块绘制到地图上。现在这不会有任何作用，因为我们需要添加其他沙地图块。为此，我们将通过绘制面板加快速度，在那里我们可以将位图块直接绘制到地形上。
b. 在 Paint Panel 中自动平铺
在您的 TileSet 面板中，在绘画下方，您可以看到您可以直接选择地形集和元素，而无需提供其 ID。
让我们确保已选择 Sand_Dessert 的地形集元素，然后在图块上直接开始绘制位对等点。请记住避免出现角落、锐边或线条。要添加位值，请在图块上单击鼠标左键。如果您需要删除位值，只需右键单击您添加的位值即可将其删除。
现在，如果您返回 TileMap 面板，您将看到其他图块已添加到地形设置自动图块中。如果您选择 Sand_Dessert 地形并开始在地图上绘图，您将看到它会自动绘制出美观、有机的地形。
现在我们可以继续为其余的地形集元素创建自动图块。如果您看不到位块，您可以随时在“地形集”>“元素”>“颜色”下的“检查器”面板中更改地形元素颜色。
这是我们的 Sand_Forest 自动耕作的地形位（使用 Water.png 图块集）：
这是我们的草地自动耕作的地形位（使用 Atlas.png 图块集）：
这是我们的 Water 自动耕作机的地形位（使用 Water.png 图块集）：
4. 绘制地形
对于我们的游戏，我将使用矩形工具，使用水自动图块绘制一个半大面积的水。绘制这个矩形的大小并不重要，重要的是在其中添加了多少个对象。单个场景中的项目太多会占用大量内存。所以请记住这一点。
我不想让玩家跑过这片水域，所以这将是我地图的边界，也就是说，玩家跑进水里就会停下来。我们稍后会为这片水域添加碰撞。
接下来，在草地层上，我要为我的地图绘制土地。尽情享受这个设计吧。只需记住地图的导航路径。如果您想更好地了解设计地图背后的工作流程，请查看这篇文章。我只是为了教程而创建这张地图，所以无论我最终得到什么都无关紧要，因为我不会出售或发布这款游戏！
图 2：地图布局示例
我们稍后还将绘制草地砖块边缘的碰撞。最后让我们将沙子添加到沙层中。我只会添加几块 Sand_Forest 砖块，因为草地边缘与我们的主草地不匹配。我只是为了向您展示这些设置是如何工作的而创建的。
如果您想为地图创建不同的环境/部分，您可以从 Water.png 图块表中添加草。
5. 添加世界物品
现在我们已经设置好了地形（记住，以后你随时可以对其进行更改），我们可以继续添加花草树木甚至建筑物等东西。不过，在执行此操作之前，让我们为图块添加碰撞，以便我们的玩家可以撞到物品。
为此，我们需要向 TileMap 添加物理层。在 Inspector Panel 中，确保已选择图块集资源，然后在 Physics Layers 下添加一个新元素。
创建物理层后，您现在可以访问 TileSet 面板中的物理层选项。
现在，我们可以通过在选择面板或绘制面板中添加碰撞来添加它们。让我们再用这两种方式重复一遍。
a. 选择面板中的碰撞
在我们的选择面板中，让我们在 Atlas.png 图块表中为树添加一些碰撞。我们根本不想让玩家穿过这棵树，所以选择树的左下根，然后在物理层 > 多边形下，我们可以开始在那个小框中绘制碰撞。让我们为整个图像轮廓添加边框。完成边框后，您可以使用框上方的点工具编辑和删除点。
绘制完碰撞边界或轮廓并连接完最后的点后，您将看到绘制的形状变为红色。这意味着它现在已添加碰撞多边形。
b. 绘画面板中的碰撞
您还可以通过绘画面板将碰撞绘制到形状上。在绘画面板中选择物理层，然后单击另一个树形图块。如果单击它，将出现一个框。蓝色表示已将碰撞形状添加到整个图块，但您可以拖入新点来勾勒出所需的形状。
现在，单击要分配碰撞形状的图块 - 以分配它。如果愿意，您还可以将此碰撞形状绘制到多个图块上。
我不会这么做，所以让我们继续绘制树其余部分的碰撞形状。
让我们创建一个新图层并将其命名为“树叶”。
现在在此图层上，选择组成树的图块，并将其绘制到地图上（靠近玩家）。
您还可以继续使用选择工具选择整棵树来创建树的图案，这样我们就不必为了创建新树而不断重新选择所有图块。
您可以将此选定项目复制粘贴或拖放到 TileMap 选项中的 Patterns 面板中。
现在您可以轻松地将您的树绘制为单一对象。
如果你运行你的场景，你现在会看到你的玩家撞上了树，而不是穿过它们。让我们将碰撞添加到其他物体，例如岩石和地形边缘。
您可以继续向水中添加碰撞以及您想要添加到世界中的任何其他内容！另外，不要忘记为您的瓷砖创建图案。
6. 创建地图
您还可以使用散布工具（骰子图标）将这些图块随机放置在地图上。散布值越高，放置在彼此近半径范围内的图块就越少。
我将继续创建一张包含占位建筑等的基本地图。在这里尽情发挥您的创造力吧。
*请注意，如果您发现您的玩家没有移动，这是因为水碰撞。您只需从您的土地/地面下方移除水砖即可解决此问题。
玩家相机
好的，现在我们有了地图，我们会注意到，如果我们运行场景，我们的玩家就会跑出地图，我们无法跟随他们！为了解决这个问题，我们需要为玩家添加一个摄像头。如果你想捕捉整个世界，你需要将摄像头连接到主场景，但如果你想跟随特定角色，你需要将摄像头连接到他们的场景。
让我们打开我们的玩家场景，并在场景码头添加一个Camera2D节点。
您会注意到，它会在玩家周围创建一个紫色边框。这是相机框架，我们可以在这些边缘添加限制，这样我们的玩家就无法看到地图中某个点以外的区域。由于我们的地图周围只有水，所以我们暂时不需要担心这个限制。
这就是本部分的全部内容。我知道这是很长的部分，甚至可能让您有点不知所措，但不用担心，因为在本教程系列的下一部分中，我们将在开始创建游戏的 GUI 时做一些新的简单的事情。请记住保存您的游戏项目，我们将在下一部分中与您见面。
