教程:“从零开始使用 ACTION GAME MAKER”—第 2 章

教程:“从零开始使用 ACTION GAME MAKER”——第 2 章

第 2 章:来制作一个简单的关卡吧!

第 2 章的目标

从这里开始,我们将正式着手制作一款动作射击游戏

在本章中,我们将一步步完成一个简单关卡的制作,在这个关卡中:

  • 玩家角色可以行走和跳跃

完成本章后,你将能够做出类似下面示例的视频内容。


制作流程

  1. 首先,我们需要创建一个用于关卡本身的场景

  2. 然后,在这个关卡中放置角色可以行走、跳跃的平台

  3. 接着,我们会创建一个角色场景,并使用 可视化脚本(Visual Script)
    为角色添加移动等基本行为。

学习“游戏场景(Game Scene)”与“游戏对象(Game Object)”

在第 1 章中,我们仅使用了 Godot 引擎 自带的功能来完成所有操作。
从这里开始,我们将正式使用 ACTION GAME MAKER 所提供的附加功能来构建游戏。

在 Godot 引擎中,通常需要将节点一个一个地添加到根节点下,
以此来制作角色、关卡等各种元素。
不过,这种方式往往会比较耗时。

为此,ACTION GAME MAKER 提供了两种主要的预设场景类型
让游戏制作过程变得更加高效:

  • Game Scene(游戏场景)

    • Game Scene 是用于制作关卡或舞台的场景。
  • Game Object(游戏对象)

    • Game Object 是用于玩家、敌人、道具等元素的场景。

在 ACTION GAME MAKER 中,你将通过把 Game Object 放置到 Game Scene 中,
来逐步构建整个游戏。


如何识别 ACTION GAME MAKER 新增的功能

ACTION GAME MAKER 新增的功能 ——
例如 Game SceneGame Object ——
都会使用蓝色与橙色相结合的双色图标进行标识。

当你看到带有这种双色图标的节点或按钮时,
就可以判断它们是 ACTION GAME MAKER 专有的功能

相对地,Godot 引擎原生的节点通常使用单色图标
(例如白色、蓝色、绿色等),
不过其中也有少数例外,会使用多种颜色。

创建“Game Scene(游戏场景)”

接下来,我们来创建一个 Game Scene(游戏场景)


操作步骤

  1. Scene(场景) 标签页中,点击 “+”(Add New Scene) 按钮。

  1. 在弹出的 Scene 窗口中,在 Create Root Node 下选择 Game Scene

  1. 随后,Scene 窗口中会自动生成大量节点。
    这些就是构成 Game Scene预设节点

  1. 由于这是一个新建的场景,我们先将它保存起来。

    • 右键点击 [unsaved] 标签,然后选择 Save Scene As

  1. 因为这是一个关卡(Stage)场景,请将其保存为 stage1.tscn


Game Scene 的结构

你可能已经注意到,突然增加了很多节点——
那么,它们各自到底起什么作用呢?

在 ACTION GAME MAKER 中,Game Scene 是通过“层(Layer)”的概念来组织的

层(Layer) 可以用来表现前后深度,类似于剧场舞台的结构:

  • 背景层(Background Layer) 位于最远处,用于显示背景布景。
  • 角色层(Character Layer) 位于中间,是角色活动和表演的空间。
  • 前景层(Foreground Layer) 位于最前方,放置最靠近观众的道具。

当从“位于前方的摄像机”进行观察时,
这些层共同构成了游戏中的一个完整场景。

ACTION GAME MAKER 默认提供了 7 个图层
它们各自拥有不同的名称与图标,功能上也略有差异,
并按照下图所示的顺序进行堆叠。

默认情况下,每一个图层都已经配置好了最低限度所需的预设节点
并且整个场景中还包含了一个用于拍摄场景的摄像机


“SceneLayer” 节点与 “UI” / “PostEffectLayer” 节点的区别

如果你仔细观察这 7 个图层的图标,就会发现它们其实可以大致分为两类:

  1. BaseDistantView 的 5 个图层
    —— 它们都是 SceneLayer 节点的子节点。

  2. UIPostEffectLayer 这两个图层。

它们之间的区别在于:

  • SceneLayer 节点 表示具有空间深度的区域,
    显示内容会随着摄像机位置的变化而发生变化。

  • UIPostEffectLayer 节点
    无论摄像机如何移动,都会始终显示在画面上。

继续使用剧场的比喻来理解:

  • 舞台本身 就是 SceneLayer
  • 覆盖在摄像机镜头前的滤镜,则是 UIPostEffectLayer

设置“初始场景(Initial Scene)”

在 ACTION GAME MAKER 中,场景是通过一个专用的 Scene Transition(场景切换)系统 来进行管理的。
该系统使用与可视化脚本类似的操作方式,用来定义各个场景之间的连接关系。

首先,我们需要将刚刚创建的场景设置为 Initial Scene(初始场景)
也就是游戏启动时最先显示的场景。


操作步骤

  1. 在画面上方中央,将编辑器模式切换为 SceneTransition

  • 这个按钮用于切换中央编辑器窗口中显示的内容。
  1. 画面中会显示一个空的网格。
  • 从左下角的 FileSystem(文件系统)面板 中,
    将之前保存的场景 stage1.tscn 拖拽到这个网格中。

  1. 如果你看到 stage1.tscn 已经出现在网格中,那么设置就完成了。

  1. 再次点击上方中央的按钮,切换回 2D 模式,返回之前的编辑视图。

image

  • 这样一来,当游戏启动时,stage1 就会作为第一个场景显示出来。

注意:如果没有设置初始场景会发生什么?

在 ACTION GAME MAKER 中,有一个名为 core.tscn 的特殊场景,
它始终会在后台运行。

通常情况下,core.tscn 会负责加载并显示你所指定的游戏场景。

如果没有设置初始场景,那么画面中只会显示 core.tscn
也就是说,游戏启动后将会看到一个空白画面

设置地块(Tiles)

现在,让我们来为关卡创建平台。

我们需要一个地面,以及一些可以跳上去的悬空平台
创建平台的方法有很多种,可以使用不同的节点,但这次我们要制作一个范围较大、形状多样的关卡,因此会使用一个专门为此设计的节点:Tile(地块)

地块(Tile) 就像地砖一样,是一种小尺寸的图片,通过在网格中重复排列,来构建平台等较大的结构。


将地块图片导入 FileSystem

首先,我们需要准备地块图片。

右键点击并保存下面提供的图片。

tile

正如第 1 章中所讲,Godot 引擎只能使用放置在项目 FileSystem(文件系统) 中的素材。
可以把 FileSystem 想象成一个仓库——游乐园里的材料必须先放进仓库,才能被使用。

导入方法非常简单:
只需将文件拖拽到编辑器中即可。

  1. 保持你电脑中存放已下载图片的文件夹处于打开状态。

  2. 在编辑器中,前往左下角的 FileSystem(文件系统)面板,并选择 res://

  • 导入的文件会被放入当前选中的文件夹中。
  1. tile.png 从电脑文件夹中拖拽到编辑器窗口内。


选择放置地块的图层

接下来,我们要决定将地块放在哪一个**图层(Layer)**中。
这里我们使用 BaseLayer,这是默认用于地面地块的图层。

展开 BaseLayer,你会看到三个节点:
Base、BaseDecoration、BaseCover
它们实际上都是 TileMapLayer 节点,只是名称不同。

为什么要准备三个类似的节点呢?

  • 这是为了能够将地块叠加显示,从而表现出前后层次。
  • 例如,你可能希望在地面地块上放置一支火把。
  • 如果只有一个图层,放置火把时就会覆盖地面地块。
  • 通过多个图层,就可以同时显示地面和装饰物。

现在,请选择名为 Base 的节点来放置地块。

在画面底部,你会看到类似下面的提示信息:
“No TileSet found. Please create a TileSet in the Inspector.”


创建 TileSet

TileSet 用于定义该 TileMapLayer 所使用地块的基本信息,例如:

  • 每个地块的尺寸形状
  • 是否可以与角色发生碰撞,还是可以直接穿过

我们准备的地块图片是一个 48×48 像素的正方形。
它将作为玩家可以站立的平台,因此必须启用碰撞。

  1. Inspector(检查器) 中,找到 TileSet
    点击 ,然后选择 New TileSet

  1. 接下来设置 TileSet 的属性如下:
  • Tile Shape(地块形状):Square
  • Tile Size(地块尺寸):x = 48 px,y = 48 px

  1. 展开 Physics Layers(物理层),点击 + Add Element

  1. 保持 Collision Layer / Collision Mask 为默认设置。
  • 如果你的 Inspector 显示出类似示例中 Physics Layer 0 的状态,
    就说明 TileSet 的基础设置已经完成。


说明:Collision Layer 与 Collision Mask

在 Godot 中,碰撞是通过以下两个设置来判断的:

  • Collision Layer(碰撞层):该节点所属的分组
  • Collision Mask(碰撞遮罩):该节点可以与哪些分组发生碰撞

我们将在第 3 章中对这一机制进行更详细的说明。


配置地块内容

创建 TileSet 后,底部的提示会变为类似:
“No source for TileSet”

这表示我们还需要为地块指定一个图像
并且设置用于碰撞的碰撞形状(地面/墙壁)

  1. 在底部面板中,将标签从 TileMap 切换到 TileSet

  1. 从 FileSystem 面板中,将 tile.png 拖拽到 TileSet 编辑器左侧的黑色区域中。

  1. 会弹出一个新窗口。
    由于我们的地块是 48×48 的正方形,请设置
    Tile Size:x = 48,y = 48,然后点击 Yes

  1. 接下来会询问
    “Set the Tile Format to Auto Tile?”
    请选择 No


说明:什么是 Atlas 和 Auto Tile

Atlas(图集) 是指将多张小图片(如地面、墙壁、斜坡等)
整合到一张大图中的方式。
引擎只需加载一张大图,再将其切分为多个地块,从而提升效率。

Auto Tile(自动地块) 是 ACTION GAME MAKER 独有的功能之一。
它可以自动整理特定格式的地块图集,不过这次我们不会使用该功能。


为地块添加碰撞形状

  1. 在 TileSet 编辑器中,切换到上方的 Select 标签。

  • 该标签用于对单个地块进行详细设置。
  1. 在右侧点击地块图片进行选择。
  • 下方的面板会切换为该地块的属性设置。

  1. 向下滚动并展开 Physics > Physics Layer 0

  • 这是之前创建的物理层。
  1. 点击 Add Polygon Tool(添加多边形工具)
    (带有“+”号的方形图标)。

  • 该工具用于添加顶点来绘制多边形。
  • 多边形就是通过连接多个点来形成的形状。
  1. 点击绿色方块的右上角,会出现一个菱形的点。

  1. 按顺时针顺序,对右下、左下、左上角重复相同操作。

  1. 最后,再次点击第一个放置的点(右上角)。

  • 地块会变成橙色,表示整个正方形已经被设置为碰撞区域

常见问题排查

  • 如果点的位置不正确
    使用 Edit Point Tool(编辑点工具)(带箭头的方形图标)来移动点。

  • 如果不小心加了太多点
    使用 Delete Point Tool(删除点工具)(带 X 的方形图标)来删除多余的点。


:white_check_mark: 到此为止,你已经成功完成了以下步骤:
导入地块图片、创建 TileSet、指定图像,并设置了碰撞,
现在这个地块已经可以作为角色站立的平台使用了。

放置地块(Placing Tiles)

现在地块已经准备好了,让我们把它们实际放到关卡中吧。
我们的目标是在摄像机可见范围内创建一个地面以及一些平台


操作步骤

  1. 查看画面中央的 编辑器视图(Editor View)

    • 你应该能看到由细紫色线条构成的一个矩形,
      它以红色与绿色坐标线交叉的点为中心。
    • 这个紫色矩形表示的是摄像机的可视范围
    • 首先,请调整视图,让整个摄像机范围完整显示出来。

  1. 在编辑器视图中,按住鼠标中键(滚轮按下)

    • 鼠标指针会变成十字形箭头。
    • 按住中键拖动鼠标,平移视图,直到紫色矩形完全进入画面。
    • 如果紫色矩形看起来太小或太大,
      请使用鼠标滚轮进行缩放,让它合适地显示在画面中。
  2. 在底部面板中,将标签切换回 TileMap(地块绘制)

    • 此时,你之前创建的地块应该已经可以使用了。

  1. 在底部面板右侧,点击地块以选中它。

  2. 将鼠标移动到编辑器视图中,
    此时地块会以预览的形式显示在鼠标指针下方。

    • 左键点击:放置地块
    • 右键点击:删除地块

  • 如果无法绘制地块,
    有可能是编辑器仍处于 Move Mode(移动模式)
    请切换回 Select Mode(选择模式)

  1. 按照下面的示例,绘制地面和平台。

  • 不需要画得一模一样,
    但如果平台放得太高,角色的跳跃可能够不到。

使用测试运行进行确认

接下来,让我们在游戏中确认实际效果。

  • 点击右上角菜单中的 Run Project(F5)
  • 如果设置正确,你应该能看到由地块构成的地面和平台正常显示。


故障排查清单

如果地块没有按预期显示,请检查以下几点:

  • 地块是否放置在**紫色矩形(摄像机可视范围)**之内?
  • SceneTransition 中,
    Initial Scene(初始场景) 是否正确设置为 stage1.tscn

设置输入映射(Input Map / 操作设置)

现在我们已经准备好了一个简单的关卡,
接下来通常就该创建玩家角色了。

不过在此之前,我们先来配置 输入映射(Input Map,操作设置)

输入映射的作用是定义:

  • “当按下这个按钮或按键时,执行这个动作。”

在本教程中,我们将制作一款操作较为简单的动作射击游戏
因此目前只需要最基础的几个动作。

这一次,我们只创建以下四个动作:

  • Attack(攻击)
  • Jump(跳跃)
  • Move Right(向右移动)
  • Move Left(向左移动)

(之后你还可以添加诸如滑行、武器切换、攀爬梯子等动作,
但现在我们只先创建最基本、必不可少的操作。)


操作步骤

  1. 在左上角的 Project(项目) 菜单中,打开 Project Settings(项目设置)

  1. 会弹出一个新窗口。
    将上方的标签页从 General(常规) 切换到 Input Map

  1. 在标有 “Add New Action” 的输入框中,输入动作名称。

  2. 输入 Right,然后点击右侧的 + Add 按钮。

  1. 使用同样的方法,继续添加以下动作:
  • Left
  • Jump
  • Attack

如果你的列表看起来和下面的示例一样,说明操作是正确的。

  1. 接下来,在 Right 这一行的最右侧,点击 “+”(Add Event) 按钮。

  1. 会弹出一个名为 “Add Event to Right” 的窗口。
    请按下键盘上的 →(右方向键)

  1. 如果窗口中显示
    RightRight (Physical)Right (Unicode)
    就说明设置成功了。点击 OK

  2. 对其他动作重复相同的步骤:

  • Left → 分配 ←(左方向键)
  • Jump → 分配 Z 键
  • Attack → 分配 X 键

当你的 Input Map 看起来与下面的截图一致时,设置就完成了。

  1. 最后,点击 Close(关闭) 按钮结束设置。

创建“Game Object(游戏对象)”场景

接下来,我们来为 Game Object(游戏对象) 创建一个场景。


操作步骤

  1. 和创建 Stage1 时一样,点击编辑器上方的 “+”(Add New Scene) 按钮。

  2. Create Root Node 下,选择 Game Object

  1. 随后会弹出 Create New Game Object(创建新的游戏对象) 窗口。
    在 ACTION GAME MAKER 中,你可以通过模板来创建各种类型的对象。
    请按如下方式进行设置:
  • Object Name:Player
  • Template:characters
  • Type:2DSprite Character Base
  • Object Group:Player
  • Object to be manipulated by input devices.:On
  • Add CameraTargetSettings Node.:On

  1. 设置完成后,将会生成一个新的场景,其中包含多个节点。

  1. 保存该场景。
    文件名可以直接使用 player.tscn

理解 Game Object 的结构

乍一看,Game Object 中包含了大量节点,可能会让人感到有些不知所措。
不过,这些节点大致可以分为三大类


1. 名称中包含 “Settings” 的节点

这类节点用于保存可以被 ACTION GAME MAKER 的可视化脚本(Visual Script)
读取和使用的数据。

通过在这里设置数值,例如 HP、攻击力、移动速度、跳跃力度 等,
就可以在 Visual Script 中直接使用这些参数。


2. 名称中包含 “Collision” 的节点

这类节点用于定义碰撞检测的形状。例如:

  • CollisionShape2D → 用于与墙壁、地面发生碰撞
  • AttackCollision → 攻击判定的碰撞区域
  • HitCollision → 被攻击时用于判定受伤的碰撞区域

3. 与动画相关的节点

  • AnimationPlayer → 用于控制角色的动画
  • Sprite2D → 提供动画中使用的图像素材

在配置 Game Object 时,你将主要使用以上这三类节点。


可视化脚本只能设置在 Game Object 上

ACTION GAME MAKER 的可视化脚本,是通过读取这些节点中的数据来工作的。
正因为如此,可视化脚本只能被设置在 Game Object 节点
(在本例中,就是 Player 节点)。


规划对象的设置内容

在本节中,我们只需要实现移动和跳跃功能。
因此,暂时还不需要配置攻击或受伤相关的内容。

目前我们只需要以下这些要素:

  • 玩家角色的图像
  • 移动与跳跃的动画
  • 移动速度
  • 跳跃力度
  • 移动用的按键设置

所以,在这一部分中,我们将只针对以上这些内容进行配置。

在 Sprite2D 上设置玩家角色的精灵图像

接下来,我们将把玩家角色的图像应用到用于显示图像的 Sprite2D 节点上。
这里我们使用本教程中提供的示例图片。


操作步骤

  1. 右键点击下面的图片,并将其保存到你的电脑中。

  1. 将下载好的图片拖拽到 FileSystem(文件系统) 中进行导入。

  1. 选择用于显示图像的 Sprite2D 节点。

  2. 在右侧的 Inspector(检查器) 面板中,找到 Texture(纹理) 属性
    (当前应显示为 <empty>),
    将导入的 player.png 文件拖拽到该属性上。

  1. 图像会显示出来——但你会发现,9 个角色全部同时显示在画面中

  • 这是因为该文件是一个 Sprite Sheet(精灵表)
    也就是把所有动画帧整合到一张图片中的形式
    (和之前在地块中提到的图集 Atlas 是类似的概念)。

  • 因此,我们需要先切分精灵表
    并告诉 Godot 当前应该显示哪一部分。


拆分精灵表(Sprite Sheet)

  1. 在 Inspector 中,展开 Animation(动画) 区域。

  1. Hframes(横向帧数) 设置为 5
    Vframes(纵向帧数) 设置为 2
  • 这样一来,整张图片就会被分割为
    5 × 2 = 10 个小帧

  1. 尝试点击 Inspector 中 Frame 属性旁边的上下箭头。

  • 每点击一次,显示的图像都会发生细微变化。
  • 游戏中的动画,正是通过这种方式实现的——
    像翻页动画一样,一帧一帧地切换图像。

说明:为什么第一帧是从 0 开始的?

你可能会觉得奇怪,为什么第一帧编号是 0,而不是 1
在编程领域中,列表和数组通常是从 0 开始计数的。

Godot 也遵循了这一惯例,因此动画帧的编号同样是从 0 开始的。

使用 AnimationPlayer 节点创建动画

在 Godot Engine / ACTION GAME MAKER 中,动画是通过 AnimationPlayer 节点 来创建的。
这个系统采用的是一种**基于时间轴(Timeline)**的方式,类似于视频剪辑软件。

在时间轴上,你可以创建用于图像、声音等的轨道(Track)
并在轨道上放置关键帧(Keyframe,事件)
随着时间的推进,AnimationPlayer 会依次执行各个轨道上的关键帧。

你可以把它想象成一份交响乐的乐谱

  • 在第 1 秒,钢琴演奏一个 C 音。
  • 在同一时间,小提琴演奏一个 D 音。

在这个比喻中:

  • 轨道(Track)=乐器
  • 关键帧(Keyframe)=演奏指令

本教程中需要的动画

在本教程中,我们将创建以下三个最基本的动画:

  • Idle(待机) → 没有任何输入时
  • Jump(跳跃) → 按下跳跃键时
  • Move(移动) → 有左右方向输入时

我们将使用 AnimationPlayer 来制作这些动画。


操作步骤

  1. 在 Scene(场景)面板中,选择 AnimationPlayer 节点。

  2. 在画面底部会出现一个新的 Animation(动画)面板
    (和之前的 Tile 编辑器类似)。

  3. 点击 Animation 按钮,并选择 New

  1. 会弹出一个窗口要求输入动画名称。
    首先创建 Idle 动画,输入名称后点击 OK

  1. 现在,Idle 动画已经创建完成。
  • 接下来,我们将使用之前设置好的精灵帧来构建动画。
  1. 选择 Sprite2D 节点。
  • 在 9 张角色图像中,Idle 只使用左上角的那一帧
  • 由于左上角的图像是 Frame 0
    因此只需要让 Idle 动画显示 Frame 0 即可。

  1. 在 Inspector 中,确认 Animation > Frame 的值为 0
  • 点击其右侧的 :key:+ 按钮

image

  • 这一步会插入一个关键帧
    将当前的帧信息记录到正在编辑的动画中。
  1. 会弹出一个窗口。
    关闭 “Create RESET Track(s)”,然后点击 Create


说明:什么是 RESET 轨道?

RESET 轨道用于指定场景的初始状态
例如,你可以把 Idle 设置为默认状态。

不过,在 ACTION GAME MAKER 中通常不会使用 RESET 轨道
因此这里保持 关闭 即可。


  1. 时间轴中会出现一条名为 Sprite2D: frame 的轨道。

  • 在 0 秒的位置,已经设置了 player.png 的 Frame 0
  • 当 Idle 动画开始播放时,就会立刻显示这张图像。
  • 由于 Idle 只使用一张图片,因此到这里动画就完成了。
  1. 按照步骤 1~8 的方法,创建 Jump 动画。

  • 跳跃动画使用的是第一行的第三张图片Frame 2

  • 如果设置正确,时间轴上会在 0 秒位置显示 Frame 2。

  1. 最后,创建 Move(移动) 动画。
  • 与 Idle 和 Jump 不同,Move 动画使用 4 张帧

    • 第二行的第 1~4 张图片 → Frame 5、6、7、8
  • 为了让动作看起来流畅,我们将每 0.2 秒切换一帧,并让动画循环播放。


创建 Move 动画

  1. 和之前一样,新建一个名为 Move 的动画。

  • 首先在 0 秒位置设置 Frame 5

  1. 将时间轴的播放头移动到 0.2 秒
    (在显示时间的输入框中直接输入 “0.2”)。

  1. 将 Sprite2D 的 Frame 改为 6
    然后点击 :key:+ 按钮 插入关键帧。

  • 现在,你应该能看到在 0.2 秒位置添加了 Frame 6。

  1. 重复相同的操作:
  • 0.4 秒,设置 Frame 7

  • 0.6 秒,设置 Frame 8

  • 现在,4 张帧已经全部放置在时间轴上了。

  1. 调整动画长度
  • 在 Animation 面板右上角,你会看到一个显示为 1 的输入框
    (默认动画长度为 1 秒)。
  • 由于我们使用了 4 张帧,每帧 0.2 秒,
    请将其改为 0.8

  • 这样可以保证动画循环时不会出现卡顿。
  1. 启用循环播放。
  • 在时间输入框旁边,点击 循环按钮(圆形箭头)。

  • 这样动画就会自动循环播放。

说明:Loop 与 Ping-Pong Loop 的区别

  • 单击一次:普通循环(动画从头播放到尾,再从头开始)。
  • 再单击一次:乒乓循环(Ping-Pong Loop)
    (动画正向播放 → 反向播放 → 再正向播放)。

image


  1. 所有设置完成后,点击 Play(播放) 按钮测试动画。
  • 如果动画播放流畅,那么就完成了!

故障排查

  • 如果动画看起来不正确:

    • 依次选中时间轴上的每个关键帧,检查其 Value(值)
    • 确认顺序是否为 5 → 6 → 7 → 8
    • 如果不正确,可以手动修改数值进行修正。
  • 同时请确认:

    • 动画已设置为 循环(Loop)
    • 动画长度设置为 0.8 秒

:white_check_mark: 至此,你已经成功为玩家角色创建了
Idle、Jump、Move 三种动画。

创建动画集(Animation Set)

在 ACTION GAME MAKER 中,有一个名为 Animation Set(动画集) 的系统,
它可以根据角色的移动方向,自动切换对应的动画

通过在一个 Animation Set 中为最多 8 个方向分配动画,
你只需要选择一次这个动画集,
当角色向右、向左、向上等方向移动时,动画就会自动切换。

在本次游戏中,我们只需要 向右向左 两个移动方向。
目前我们已经创建了 Idle、Jump、Move 三个动画,
而且它们全部都是朝向右侧的动画。

不过,系统默认启用了自动翻转动画(Auto Flip)的选项。
这意味着我们
不需要
为左方向单独制作动画,
系统会自动将右向动画进行左右镜像显示。

另外,在这种情况下
(只需要左右移动,并且可以通过翻转来实现左向动画),
我们可以使用 批量导入(Bulk Import)功能
快速完成 Animation Set 的设置。


操作步骤

  1. Scene(场景)面板 中,选择 Player 节点
    (也就是 GameObject 节点)。

image

  1. Inspector(检查器) 中,点击
    Select Animation Player 按钮。

  2. 会弹出一个节点选择窗口,请选择 AnimationPlayer 节点。

  1. 接下来,点击 Bulk Load Animations(批量加载动画) 按钮。

  1. 为了确认设置是否成功,请展开 Animation Set 区域。

  2. 如果操作正确,你应该能在 Animation Set 中看到
    Jump、Idle、Move 这三个动画。


故障排查

  • 如果动画没有显示在 Animation Set 中:

    • 请返回 Assign AnimationPlayer
      重新指定一次 AnimationPlayer 节点。

调整玩家设置(Player Settings)

现在动画已经创建完成,接下来我们来配置玩家的各项设置。
我们需要完成以下三件事:

  1. 设置移动所使用的按键
  2. 调整移动速度与跳跃力度
  3. 调整碰撞形状(Collision Shape),使其与角色身体大小一致

设置移动按键

首先,使用之前设置好的输入动作来指定角色的移动按键。

  1. Scene(场景)面板 中,选择 MoveAndJumpSettings 节点。

  1. Inspector(检查器) 中进行如下设置:
  • Left Move Key → Left
  • Right Move Key → Right


调整移动速度与跳跃力度

接下来,我们来调整角色的移动速度和跳跃力度,使其更适合游戏操作。

  1. 保持 MoveAndJumpSettings 节点处于选中状态,查看 Inspector。

  2. Horizontal Speed(水平速度)
    100 改为 300

  • 这样一来,当按住方向键 1 秒时,角色就会移动 300 像素

  1. 在靠近下方的位置找到 Jump Force(跳跃力度)
  • 将其从 500 改为 700

  • 这表示在按下跳跃键时,角色会以 700 像素/秒 的速度向上跃起。

调整碰撞形状(Collision Shape)

CollisionShape2D 节点用于定义角色与地面及其他物体发生碰撞时的形状。
目前这个形状还太小(甚至比角色的头还小),
会导致角色身体“陷入”地面中。

我们需要将它调整到与角色整体大小相匹配。

  1. Scene(场景)面板 中,选择 CollisionShape2D 节点。
  • 你会看到一个由橙色点围成的小蓝色矩形,这就是当前的碰撞形状。

:warning: 如果此时角色显示的是 JumpMove 的动画帧,
请先将 AnimationPlayer 切换回 Idle

  • 这样可以更方便地将碰撞形状与角色身体对齐。
  1. 点击并拖动矩形四角的橙色控制点来调整大小。
  • 将碰撞形状调整为覆盖角色的整个身体


:white_check_mark: 完成以上设置后,
你的角色将能够正确响应输入,
以合适的速度进行移动和跳跃,
并且与地面发生碰撞时不会再出现下沉的问题。

使用可视化脚本(Visual Script)让角色移动

现在,所有准备工作都已经完成了 ——
让我们使用 可视化脚本(Visual Script) 来让玩家角色真正动起来吧。

首先,我们需要给 Player 添加(附加)一个 Visual Script


添加可视化脚本(Visual Script)

  1. Scene(场景)面板 中,选择 Player 节点(GameObject)。

  2. 点击 :scroll:+(Attach Script,附加脚本) 按钮。

  1. 会弹出一个新窗口,询问要附加 VisualScript 还是 GDScript(标准编程脚本)。
  • 由于我们选择的是 Player 节点(GameObject)
    VisualScript 会被自动选中。

  • 这里直接点击 Create(创建) 按钮即可。
  1. 编辑器视图会自动切换到 Script(脚本) 标签页。
  • 你会看到两个框:State001AnyState
  • 这就是 Visual Script 的工作区


返回之前的视图

如果你想回到之前的编辑画面,
只需将上方的标签切换回 2D 即可。

正如在 Scene Transition(场景切换)部分中所说明的那样,
顶部的标签页用于切换编辑器当前显示的内容。

image

创建状态(States)

决定需要哪些状态

正如第 1 章中所说明的那样,
ACTION GAME MAKER 的可视化脚本(Visual Script)是通过以下方式构建的:

  1. 为角色的**状态(State)**添加行为
  2. 根据条件将这些状态**连接(切换)**起来

在本教程中,角色只需要在关卡中行走和跳跃,
因此我们只需要以下三个状态:

  • Idle(待机)
  • Move(移动)
  • Jump(跳跃)

通过在合适的条件下连接并切换这三个状态,
就可以实现玩家角色的基本移动行为。

首先,我们来准备 Idle、Move、Jump 这三个状态,
并为它们分配对应的动画和行为。
已经存在的 State001 可以直接作为 Idle 状态来使用。


创建 Idle 状态

  1. Script(脚本)窗口 中,选择 State001

  2. 在 Inspector 中,将 Title 从 “State001” 改为 Idle

  1. Animation to assign > Animation Select 中,
    点击空白字段并选择 Idle

  • 这样一来,当角色处于 Idle 状态时,就会播放 Idle 动画集。

创建 Move 状态

Move 状态需要作为一个新的状态来创建。

  1. Idle 状态右侧的空白区域中 右键点击

  2. 从菜单中选择 Add State(添加状态)

  1. 会出现一个新的 “State001”。
    将其 Title 重命名为 Move

  2. Animation Category(动画分类) 中,选择 Move

  • 这样一来,当角色处于 Move 状态时,就会播放 Move 动画。

创建 Jump 状态

Jump 状态不仅需要动画,还需要实际执行跳跃动作。

  1. IdleMove 状态下方,新建一个状态。

  2. 和之前一样,将 Title 改为 Jump
    并将 Animation 设置为 Jump

  1. 展开 Action Settings(动作设置) 区域。
  • 勾选 Jump 选项。

  • 这样一来,当角色进入 Jump 状态时,
    就会自动执行一次跳跃动作。

说明:为什么 Move 状态中没有类似“执行移动动作”的设置?

基于玩家输入的移动操作,
已经由 MoveAndJumpSettings 中设置的按键绑定来处理了。

这个系统会作用于所有状态
因此 Move 状态本身不需要额外的动作设置来实现移动。


:white_check_mark: 到这里为止,你已经成功创建并配置了
Idle、Move、Jump 这三个核心状态,
它们已经可以用来驱动角色的基本行为了。

使用链接(Link)连接各个状态

现在我们已经创建了三个状态,
接下来要用 链接(Link) 将它们连接起来,让角色能够在状态之间顺畅切换。


思考状态切换条件

在本游戏中,基本逻辑如下:

  • 按下 左/右 键 → Move
  • 按下 跳跃 键 → Jump
  • 没有任何输入 → Idle

也就是说:

  • 按下左/右键时 Idle → Move,松开所有按键时 Move → Idle
  • 在 Idle 状态按下跳跃键时 Idle → Jump
  • 在移动中按下跳跃键时 Move → Jump
  • 落地(角色底部与地块接触)时 Jump → Idle

:backhand_index_pointing_right: 那么,是否需要 Jump → Move 的链接呢?
其实不需要。
如果在落地时仍然按着移动键,
会立刻触发 Idle → Move
因此并不需要直接从 Jump 跳转到 Move。


连接 Idle 与 Move

  1. 右键点击 Idle 状态,选择 Add Link(添加链接)

  1. 从 Idle 拖动连线到 Move 状态。

  • 现在 Idle 和 Move 已经连接起来了。
  • 接下来设置条件:按下左/右键时切换到 Move。
  1. 选中这条新建的链接,在 Inspector 中勾选 Trigger On Input

  1. 展开 Input Operation List(Array[InputCondition])

  2. 点击 + Add Input

  1. 会出现一个 <empty>,点击它并选择 New Input Condition

  1. <empty> 会变成 Input Condition,点击展开。

  2. 按如下方式进行设置:

  • Input Target:Four Any Input Keys
  • Up Key:None
  • Down Key:None
  • Left Key:Left
  • Right Key:Right
  • Input Method:Being Pressed

  1. 现在,当按住 Left 或 Right 键时,
    角色就会从 Idle → Move

  2. 接下来创建 Move → Idle 的链接。
    右键点击 Move,选择 Add Link

  3. 选中新建的链接。

  1. 在 Inspector 中勾选 Trigger On No input

  • 这样,当没有任何按键输入时,角色就会返回 Idle。

将玩家放入关卡并测试

到这里为止,角色应该已经可以在地面上左右移动了。
让我们把 Player 场景放入 stage1.tscn 并进行测试。

  1. 将编辑器视图从 Script 切换回 2D

  2. 保存 Player 场景:
    右键点击 player 标签页,选择 Save Scene

  1. 切换到 stage1.tscn 标签页。

image

  1. 在 Scene 面板中,选择 Base(TileMapLayer)

  1. 从 FileSystem 中,将 player.tscn 拖拽到关卡中,
    放置在地面上。

  2. 确认 Player 是 BaseLayer 的子节点

  • 如果层级不正确,请在 Scene 面板中拖动调整。
  • 如果位置不合适,可以使用 Move Mode 调整。
  1. 点击右上角的 Run Project(F5)

  2. 如果一切正常,角色将会:

  • 按下 Left / Right 时行走
  • 松开按键时停止

常见问题排查

  • 角色不移动
    → 检查 MoveAndJumpSettings 中是否正确设置了输入按键。

  • 角色移动但动画不切换
    → 检查 Idle → Move 的链接,以及 Move 状态的动画设置。

  • 角色无法回到 Idle
    → 检查 Move → Idle 链接的条件是否正确。

:warning: 错误提示:ID is not set in CameraTargetSettings.
这是因为 CameraTargetSettings 存在但尚未配置。
我们会在 第 4 章 中设置摄像机跟随,因此现在可以安全忽略这个提示。


连接 Idle、Move 与 Jump

接下来,把 Jump 状态也连接进来。

  1. 切换回 player 标签页,并将编辑器切换到 Script 视图

image

  1. 右键点击 Idle,添加链接并连接到 Jump

  2. 选中该链接,启用 Trigger On Input

  1. 展开 Input List → + Add Input → New Input Condition

  1. 按如下方式设置:
  • Input Target:Registered key
  • Input Key:Jump
  • Condition:Moment pressed

  • 这样,在 Idle 状态按下 Jump 键时就会进入 Jump。
  1. 接下来连接 Move → Jump
  • 因为条件完全相同,我们可以复用 Idle → Jump 的链接。
  1. 右键点击 Idle → Jump 链接,选择 Copy

  1. 右键点击 Move 状态,选择 Paste Link

  1. 将新链接拖动连接到 Jump

  2. 选中 Move → Jump 链接,确认条件设置正确(Jump 键被按下)。


连接 Jump 返回 Idle

  1. 右键点击 Jump 状态,添加链接并连接到 Idle

  2. 因为这不是基于输入的切换,
    在 Inspector 中点击 + Add Condition

  1. 在弹出的窗口中选择 ContactWithTile

  2. 将条件设置为
    Incoming Contact Direction → Bottom

  • 这表示:只有当角色底部与地块接触(落地)时,才会触发切换。
  1. 如果链接显示为如下状态,说明设置完成。


测试运行

点击 Run Project(F5)

  • 在 Idle 或 Move 状态下按 Z → 角色应当跳跃。
  • 落地后,角色应当返回 Idle。

常见问题排查

  • 无法跳跃
    → 检查 Idle → Jump 与 Move → Jump 的链接,
    并确认 Jump 状态中启用了 Jump Action。

  • 无法落地返回 Idle
    → 检查 Jump → Idle 链接,
    并确认设置了 “ContactWithTile(Bottom)” 条件。


:white_check_mark: 至此,你已经成功使用可视化脚本,让角色能够 顺畅地待机、移动和跳跃 了!

第 2 章 回顾

在第 2 章中,我们学习了 Game Scene(游戏场景)Game Object(游戏对象) 的概念,
并分别创建了一个关卡和一个玩家角色。

  • Game Scene 中,我们学习了 图层(Layer) 的概念,
    以及如何 导入并放置地块(Tile)

  • Game Object 中,我们学习了如何
    导入图像、创建动画、调整各项设置,并附加可视化脚本(Visual Script)

这样的工作流程,几乎适用于所有类型的游戏开发。
因此,在你今后的项目中如果遇到困难,
回顾并对照这些步骤,往往能帮助你理清思路。

到这里为止,你已经掌握了 ACTION GAME MAKER 的基本操作和核心概念
第 3 章 中,我们将更进一步,
通过加入 子弹射击敌人角色的创建
让游戏更接近真正的成品。

:backhand_index_pointing_right: 第 3 章请见这里

1 Like