04 UMG界面
简介
UE4提供的界面开发系统
HUD (Heads-Up Display)：
HUD是一个基本对象，用于在屏幕上覆盖显示元素。
它用于创建诸如生命值条、能量值、弹药计数、游戏得分等元素。
- HUD 是显示屏幕上覆盖的元素的基本对象。游戏中每个由人类控制的玩家 都有自己的
AHUD类实例，这个实例会绘制到个人视口上。如果是分屏多人游戏， 多个视口会共享同一个屏幕，但每个HUD仍会绘制到其自己的视口上。
Slate：
Slate是虚幻引擎中的自定义用户界面系统的名称，是UE4附带的一个完全可定制的、平台无关的用户界面框架。
Slate是虚幻中真正的UI框架，包含了输入处理，事件分发，绘制，渲染等核心功能
早期UE4编辑器界面本身就是使用Slate框架创建的，如今大部分也是用Slate创建的
Slate编写布局界面非常麻烦
UMG (Unreal Motion Graphics UI Designer)：
UMG是虚幻4中基于Slate构建的界面编辑系统，是一个可视化UI创建工具，可用于创建UI元素，如游戏内的HUD、菜单或其他与界面相关的图形。
为什么用UMG？直接用Slate来“编写”界面布局非常麻烦，需要一个友好的界面编辑器。方便与蓝图进行交互，可在蓝图中控制界面。
UMG是对Slate的封装，方便界面编辑以及支持虚幻的垃圾回收机制。Slate是底层真正的Ul实现。
基本概念及常用控件
控件Widget
- 引擎预先封装好的，可以直接拿来使用的一个功能单元。比如: Image、Button
UI蓝图
- 编写蓝图代码，控制控件的显示隐藏，调整位置，响应事件等
槽Slot
- 面板控件中用于摆放子控件，包含了定义如何“摆放”的数据信息。如CanvasPanel的Slot说明了槽的位置、大小、堆叠次序等信息
锚点Anchor
- 主要用于CanvasPanel的Slot，描述了如何设置槽的位置、大小。直观来看就是子控件相对于父控件的位置关系。
常用控件
按钮
按钮是单子项、可点击的Primitive控件。它可实现基本交互。
你可将任何其他控件放入按钮控件中，以在UI中创建一个更复杂且有趣的可点击元素。
复选框(Check Box)
借助复选框(Check Box)控件，你可以显示“未选中”、“选中”和“不确定”三种切换状态。你可以使用复选框(Check Box)控件来制作经典复选框、切换按钮或单选按钮。
图像(lmage)
借助图像(Ilmage)控件，你可在UI中显示Slate笔刷、纹理、Sprite或材质。
进度条(Progress Bar)
进度条(Progress Bar)控件是可以逐渐填充的简单条形，可以重新设计样式以适应各种用途，例如经验值、生命值、分数等。
文本(Text)
在屏幕上显示文本的基本方法，可以用于选项或其他UI元素的文本说明。
文本框(Text Box)
允许用户输入自定义文本。仅允许输入单行文本。
面板控件
面板(Panel)类别中包含用于控制布局和放置其他控件的有用控件
画布面板(Canvas Panel)
允许在任意位置布局、固定控件，并将这些控件与画布的具它子项按z序排序。
网格面板(Grid Panel)
在所有子控件之间平均分刮可用空间的面板
水平框(Horizontal Box)
用于将子控件水平排布成一行。
纵向框( Vertical Box)
用于自动纵向排布子控件。当需要将控件上下堆叠并使控件保持纵向对齐时，此空件很有用。
滚动框(Scroll Box)
一组可任意滚动的控件。当需要在一个列表中显示10-100个控件时非常有用。该控件不支持虚拟化
控件切换器(widget Switcher)
控件切换器类似于选项卡控件，但没有选项卡，你可以自行创建并与此控件组合以获得类似于选项卡的效果。一次最多只显示一个控件
优化控件
无效框( Invalidation Box)
封装在失效框中的控件可以令子控件几何图形进行缓存，以加快平板的渲染速度。任何由无效框缓存的控件都不会进行预处理、绘图或上色。
限位框(Retainer Box)
先将子控件渲染到渲染目标，然后再将该渲染目标渲染到屏幕。使用该选项，你可以控制频率和相位，以使UI的实际渲染频率低于主游戏渲染频率。它的附带好处是允许在绘制控件之后将材质应用给渲染目标，以应用简单的后期处理,
让界面动起来
如何在UMG中创建动画?
控件蓝图编辑器的底部有两个窗口，可用来实施和控制UI控件的动画。第一个是动画窗口，可以创建用来驱动控件动画的基础动画轨。第二个是时间轴窗口，用于指定动画如何随时间应用至控件。
- 添加动画轨道
- 添加动画关键帧
扩展控件库
自定义控件，避免重复造轮子
- 纯UMG实现
- C++实现
性能
- 不用或少用属性绑定
- 尽量不在UI蓝图中实现Tick
- 复杂蓝图逻辑转C++，然后在蓝图中调用C++实现的函数
- 正确设置“隐藏”(Hidden <==> Collapsed)
- 无效框:
- 无效框可以缓存UI绘制的中间数据，减少绘制的CPU消耗
- 合理结构提升渲染性能:
- 减少UI层级，从而减少UI绘制过程的递归调用
- 合理规划UI层次，合并图集，批量渲染以减少DrawCall