UE4笔记-UMG

UE4笔记-UMG
1，锚的概念
锚（Anchor）⽤来定义 UI 控件在画布⾯板上的预期位置，并在不同的屏幕尺⼨下维持这⼀位置。

锚也可以理解为就是⽤来设置布局⽅式的，随着屏幕尺⼨的改变，定义这个UI相对于⽗节点怎么停靠以及是否拉伸。

Detail⾯板也有预设的锚，⼤多数情况下预设锚就可以满⾜设计需求:
Position X 、Position Y 就是对其点(Alignment)相对于锚点的位置偏移
Size X、Size Y 就是这个空间的宽⾼
Size To Content 定义控件尺⼨是否有由控件的内容指定，⽐如在⼀个勾选了Size To Content的Canvas Panel⾥边放⼀个Button, 这个Canvas Panel的Size会随着⾥边Button Size的变⼤⽽变⼤，减⼩⽽减⼩。

ZOrder 指定层级关系，值越⼤越后渲染，越在上层
2，常⽤控件
Border 是⼀个只能包含⼀个⼦控件的容器，提供使⽤边框图像和可调节的填补将其包围起来的机会。

Button 按钮~
Check Box 复选框可以显⽰“未选中”、“选中”和“不确定”三种切换状态，可以使⽤复选框（Check Box）控件来制作经典复选框、切换按钮或单选按钮
Image 图⽚，可以在画刷选项⾥给他选⼀个图⽚，也可以在画刷选项⾥给他着⾊（Tint）就相当于在上⾯蒙⼀层颜⾊
Name Slot 是⼀个可⽤任何其他控件来填充的外部槽，填充的控件的⼤⼩由这个槽来控制
Progress Bar 进度条，Bar Fill Type 可以选择Left to Right、Right to Left、Fill from Center、Top to Bottom、Bottom to Top
Slider 滑动条~
Text ⽂本可以设置锚点、⼤⼩、字体、颜⾊、描边、阴影、是否⾃动⾏
ComboBox 包含列表的下拉菜单
Spin Box 数字输⼊框，就像ue4⾥很多属性输⼊框⼀样，允许直接输⼊数字或点击并滚动数字，数字的⼤⼩字体什么的在Display-Font ⾥设置
TextBox 单⾏⽂本输⼊框
TextBox(Multi-Line) 多⾏⽂本输⼊框
Editable Text 相当于简易版的Text Box但没有框背景
Editable Text(Mutil-Line) 相当于简易版的Text Box(Multi-Line) 但没框背景
Canvas Panel画布⾯板可以在上⾯摆放任意控件
Grid Panel ⽹格⾯板，在所有⼦控件之间平均分割可⽤空间的⾯板。

Fill Rules可以设置每个单元格内控件的拉伸⽐重，这个是Grid Panel⾃⾝的属性，选中单元格内控件，该控件Grid Slot中：
Padding：表⽰距离单元格内边距，也可以理解为留⽩距离单元格留多⼤空隙，
Horizontal Alignment：横向对齐、Vertical Alignment：垂直对齐
Row：表⽰在Grid Panel中的⾏索引
Row Span：跨⾏
Column：在Grid Panel中的列索引
Column Span：跨列
Layer：相当于ZOrder，当两个控件在⼀个单元格中的时候通过设置Layer调整显⽰顺序
Nudget.X、Nudget.Y，偏移，跟Render Transform中Transform作⽤相同。

Grid Panel的单元格默认情况下是尽可能的⼩，如果⼿动把⼀个控件的列索引设置成原来的列索引+1，做出空出⼀列的效果，但是实际显⽰效果并没有空出⼀列，其实内部已经空出了⼀个空的单元格，只不过这个单元格中没有控件，⼜遵循尽可能⼩的原则所以看不出来，这时候可以通过Fill Rules设置⼀下单元格的拉伸⽐重，就可以显⽰出这个空的单元格了。

Horizontal Box ⽔平框，是内部控件⽔平布局
Overlay 允许控件上下堆叠的⼀个容器，其内部的控件叠加在⼀起，不能设置位置，也不能设置ZOrder(层级只能在编辑器⾥边⼿动调节)，压根就没有ZOrder属性，内部控件可以调整⾃⼰的布局⽅式（上、下、左、右停靠，⽔平⽅向、垂直⽅向拉伸）
Safe Zone 拉取平台安全区信息并添加填充。

例如刘海屏，如果UI按等⽐拉伸可能会被上边的刘海挡住，如果把Saft Zone作为根节点，Saft Zone内的⼦控件就不会被刘海挡住了
Scale Box 缩放框，允许⽤户按所需⼤⼩放置内容并将其缩放为符合框内所分配区域的约束尺⼨的控件。

Stretching属性项来设置拉伸⽅式（Scale to Fill充满整个框、Scale to Fit X充满X轴向、Scale to Fit Y充满Y轴向还是Scale to Fit 保持原⽐例填充）
Scroll Box 可以设置横向、纵向滚动的框
Size Box ⽤于指定所需尺⼨。

⽤了再说吧
Uniform Grid Panel 在所有⼦控件之间平均分割可⽤空间的⾯板。

可以设置⼦控件内边间距和所在的⾏列索引值
Vertical Box 和横向布局的框差不多，只是⽅向变成了纵向⽽已
Widget Switcher 控件切换器类似于选项卡控件，但没有选项卡，你可以⾃⾏创建并与此控件组合以获得类似于选项卡的效果。

⼀次最多只显⽰⼀个控件。

通过设置Active Widget Index的值来控制显⽰那个⼦控件。

Wrap Box 该控件会将⼦控件从左到右排列，超出其宽度时会将其余⼦控件放到下⼀⾏。

Circular Throbber 循环展⽰图像的动态浏览图⽰控件。

Menu Achor 菜单锚本⾝不显⽰任何东西，只是⽤来指定⼀个位置，弹出菜单将从此处调出并被锚定在此处。

Native Widget Host 容器控件，可包含⼀个⼦Slate控件。

只需要在某个UMG控件中嵌套⼀个原⽣控件时，应使⽤该控件。

⽤的很少…Spacer 隔离控件（Spacer）提供与其他控件之间的⾃定义填充。

隔离控件并不进⾏视觉呈现，在游戏中不可见。

Throbber 动画式的动态浏览图⽰（Throbber）控件，在⼀⾏中显⽰⼏个缩放的圆圈（例如，可以⽤来表⽰正在进⾏加载）。

Expandable Area 可扩展区域，它包含Header和Body两个部分。

借助它，你可以折叠或展开容器中的⼦控件。

3， Sprite切图
可以在Brush.Image 中选则Sprite,选择保存的位置并命名（⼀般情况下把那个合图命名为Spritex_0）。

然后双击打开编辑界⾯a，选择源⽂件 b，点击编辑源⽂件按钮进⼊编辑状态
编辑源⽂件可以选动全部导出，也可以按住Ctrl+双击某个图来导出单个图
4，动画
1，点击+Animation按钮添加动画轨并为这个动画轨命名, 添加动画轨之后，时间轴（TimeLine）就可以编辑了。

2，点击+Track按钮选要添加动画的UI控件
3，拖动时间滑块，给特定时间点添加关键帧，控件Detail⾯板只要有这种⼩加号的都是可以添加关键帧的。

4，切到图表窗⼝把刚刚创建的动画轨变量拖出来，调⽤Play Animation来播放动画。