Choose your operating system:
Windows
macOS
Linux
使用UMG创建的每个 控件蓝图 都被视为 用户控件 ,其可在其他控件蓝图中重复使用和放置。 其视觉效果和脚本功能都将延续到该蓝图中。
利用某些蓝图脚本,可创建UI控件的运行方式或外观的变量,可逐实例基础覆盖此类方式或外观。 本操作指南中将创建按钮并设定样式,通过此操作,便可在将其放置入其它控件蓝图时覆盖样式。 最后,可自定义逐实例基础点击按钮时的结果。如在菜单中具有一系列按钮,且希望其外观和操作相同,但点击后产生的结果不同,此操作将十分有用。
1 - 设置按钮控件
首先,需创建按钮并设置点击按钮时要运行的脚本。
本操作指南将使用 蓝图第三人称模板 ,同时启用 初学者内容包 。
-
右键点击 内容浏览器 ,创建两个 控件蓝图 ,一个命名为 CustomButton ,另一个命名为 HUD 。
CustomButton 为要添加到 HUD 控件蓝图中的用户控件。
同时还可通过前往到 内容浏览器 > 新增 > 用户界面 添加控件蓝图。
-
删除 CustomButton 空间蓝图中的 画布面板 。然后,添加按钮并右键点击,选中 用于包裹(Wrap With) > 尺寸框(Size Box) 。
-
在 尺寸框 细节 面板中,将 宽度覆盖 改为 300 , 高度覆盖 改为 100 。也可将图形布局改为 实际屏幕显示(Desired on Screen) ,以了解按钮的实际大小。
-
在事件图表中,长按 Ctrl 键并从 我的蓝图 面板中拖出 按钮 。然后,拖出引脚并添加 设置样式(Set Style) 节点。确保选中 Variable Apperance 节点,而非 Button Function 节点。
-
将 Event Construct 节点连接到 Set Widget Style 节点,然后右键点击 控件样式 并选择 升级为变量 。
-
将新变量命名为 ButtonStyle ,然后 编译 蓝图。然后,将 法线 > 图像 样式设为任意纹理。
-
右键点击 法线 部分,然后选择 复制 。然后,将图像设置粘贴到 悬停 值和 按下 值。所有三个数值现应具有相同图像纹理。
-
展开 悬停 并将 着色 颜色改为任意颜色(如黄色)。
-
在 ButtonStyle 中,勾选 实例可编辑(Instance Editable) 和 生成时公开(Expose on Spawn) 。
利用此操作,可在其他蓝图中使用该控件蓝图时,修改此变量的值。
-
选择 Button 变量,然后点击 + 号将 OnClicked 节点添加到图表。
-
在 MyBlueprint 面板中,选择 事件调度器 以新建名为 ButtonClicked 的 事件调度器 。
-
将 ButtonClicked 拖入图表,选择 调用 ,然后将该节点连接到 OnClicked 事件。
点击按钮时,其将创建专属的脚本功能。如拥有此按钮的多个实例,且仅使用 OnClicked 事件,各实例将进行响应并执行相同功能。然而,通过创建 事件调度器 ,即可在逐实例基础上实现事件,同时仅有实际点击的按钮才会触发额外脚本。
2 - 将按钮控件添加到HUD控件
创建并编写按钮控件后,现在可将按钮添加到HUD控件,同时将HUD添加到视口,游戏内即可显示按钮。
-
打开 HUD 控件蓝图,并向 画布面板 添加 垂直框 。将框的尺寸调小。
-
在 用户创建 下的 选用板 中,向 垂直框 添加三个 自定义按钮 。
-
在事件图表中,选择所有 CustomButton ,然后点击 + 将 点击按钮 事件添加到图中。现在应有3个事件,每个按钮一个。
此为 CustomButton 控件蓝图中创建的 事件调度器 ,点击此特殊按钮时其将进行响应。
-
对于各 ButtonClicked 事件,拖出引脚并将 Print String 节点连接到各事件。在 字符串中 文本框中添加不同文本。
本例中将根据点击的按钮将不同文本打印到屏幕。在现实范例中,可让各按钮打开不同菜单、修改不同游戏设置,或对玩家角色进行改造。
基于范例目的,本指南模拟点击按钮。欲了解制作HUD菜单的方法,参见UMG UI设计器快速入门指南中的 创建主菜单 。
-
从关卡编辑器主工具栏前往 蓝图 ,并选择 打开关卡蓝图 。
-
在事件图表中点击鼠标右键,并添加 Event BeginPlay 节点。将节点连接至 Create Widget 节点,并将 类 设为 HUD 。
-
添加 Add to Viewport 节点,并将其连接至 Create HUD Widget 节点。然后,将 Get Player Controller 函数添加到 Set Show Mouse Cursor 节点,并勾选此复选框(将其设为True)。
-
编译 、 保存 ,再关闭 关卡蓝图 ,然后在编辑器中点击 运行 ,与游戏中的按钮进行交互。
最终结果
在编辑器中运行时,将基于已定义的 ButtonStyle 变量自动设置各按钮的样式,调用 事件调度器 和相应的 ButtonClicked 事件时,此类按钮将执行脚本的不同部分。 ButtonStyle 为公开变量,且在生成时可编辑,因此可将其放入控件蓝图覆盖其中按钮样式。如不想在各蓝图中重新创建某些动画或其他复杂脚本逻辑,操作将十分有用。通过将按钮创建为用户控件,可在任何其他控件蓝图中重复使用,而无需进行额外工作。