虚幻引擎(UE4) UMG 创建菜单

查看详细文档地址

UMG

UMG是Unreal Motion Graphics UI Designer的缩写，它是一个可视化的UI制作工具。可以用于创建UI元素(例如游戏内的HUD，菜单或者其他能和角色交互的信息)。UMG是核心是Widgets，它采用一系列预先写好的函数来构建你的用户界面(像按钮、复选框、进度条、滑动条等)。这些Widget在专门的蓝图中编辑，提供了2种选项卡：一个可视化布局的设计界面和一个Widget相关属性功能的图表界面。

创建UMG

1 .在资源窗口中点击Add New 或者在空白处鼠标右键->UserInterface->Widget Blueprint。

2. 将创建的UMG命名为MainMenu，并双击打开：

3. Palette视图中列举了可以使用的UI部件，直接鼠标选中拖到下面的Hierarchy窗口中，这里已经添加好了几个部件，层级结构如下图:

层级机构视图中画布上包含了一张图片，一个竖直的列表，3个按钮。当部件较多时，可以利用搜索功能快速查找对应的部件。

4. 选中Vertical Box复制粘贴，创建一个新的部件副本

5. 在新的部件副本中再额外添加一个按钮

6. 选中第一个Vertical Box，重命名为MainMenu，勾选复选框Is Variable，设置渲染层级ZOrder为1。

在这一步中我们重命名了部件名称，并将其设置为变量，还设置了渲染层级。这样做的好处是我们可以利用函数获取该变量，便于我们对其进行逻辑处理。

7. 选中其他Vertical Box，并对其重命名，如下：

8. 设置对应的文本信息

9.按住Ctrl键选择多个按钮，设置鼠标光标悬停在按钮上时的颜色，并设置按钮布局类型为FILL(填充)

10. 选中画布上添加的图片Image_0，在Detail界面设置图片资源

如果需要使用原图片的尺寸，请将Size To Content选项勾上。画布中就显示了当前的图片：

11. UI元素的布局可以在如下的选项卡中设置:

12. 选中两个菜单列表，设置如下图，使两个菜单在不同尺寸的屏幕上都能停靠(横向靠左，纵向靠中)。

13. 选择OptionMenu菜单，设置可见性Visibility为Hidden(我们希望默认情况下这个菜单不显示)。

14. 你可以调整一些文字大小和对齐方式

15.调整位置和尺寸，默认只显示一个菜单。

到此可视化的界面布局已经完成。接下来需要添加蓝图脚本将UMG添加进游戏中。

蓝图脚本

1. 添加按钮绑定

2. 在打开关卡蓝图

3.在事件图表中，游戏开始时，调用蓝图节点(CreateWidget)将UMG添加到游戏视图中：

4. 开始游戏