Unity-UI（UGUI详解）03 UI How Tos

UI的常用解决方案：

针对不同分辨率的解决方案

现代游戏应用需要支持不同的屏幕和分辨率，UI布局需要去适应这些。Unity中的UI系统包括丰富的工具针对这个问题。

1.锚点
第一种解决方案，使用锚点设置图片相对屏幕的角落的相对位置。当当前分辨率是游戏设计的布局的时候使用这种方式是正确的。
当屏幕分辨率变得更大或者更小的时候，按钮保持被锚在他们之前设定的角落。然而，他们还保持着他们的原始大小，这可能使这些元素看起来很大或者很小，这样他们就不能被正确的绘制出来。
为了解决屏幕分辨率变大或者变小的时候图片不能跟随变大变小的情况，使用Canvas Scaler来解决问题。

2.缩放屏幕大小
Canvas Scaler组件被添加在Canvas的根节点
可以将UI Scale Mode设置为 Scale With Screen Size，在这个模式下可以如果分辨率增多大或者减小，Canvas Scaler将自动进行调整。

需要注意：
从竖屏变到横屏的时候，如果使用上面的方式会出现一些问题，这是由于Canvas Scaler的原理引起的问题，Canvas Scaler对比宽度通过宽度的变化得到Canvas Scaler

有一个属性叫Match从0（Width）到1（Height），默认情况下设置为0，表示完全通过宽度比较作为Canvas Scaler的值。
如果Match 的值被设置为0.5，那么将同时比较宽度和高度，在两个值之间进行选择。

UI element与他们内容的大小适配

通常情况下我们通过Rect Transform对UI元素的位置大小进行设置，然而我们希望自动进行适配UI元素，这个问题可以通过添加Content Size Fitter解决

Fit to size of Text
为了使Text组件与文本内容大小进行适配，使用Content Size Fitter组件进行控制
原理：
text组件作为layout element提供信息它minimum的大小和preferred的大小。Content Size Fitter是一个Layout Controller，使用Layout element的信息对Rect Transform的大小进行控制
注意中心：
当文本框进行大小重新布局的时候，中心的位置将影响layout element的缩放扩大的方向，需要额外注意pivot的位置

Fit to size of UI element with child Text
Button一般是由Image和Text组成，我们希望让Image中的大小通过Text的大小来决定。
在Image组件下添加Horizontal Layout Group组件，都选Child Controls Size下的Width和Height。添加Content Size Fitter，将Horizontal Fit 和 Vertical Fit进行设置。
原理：
Horizontal Layout Group同时提供了LayoutController和LayoutElement，它将接收children的layout information，之后它通过全部的children来决定group的大小，之后它作为Layout Element提供了它的minimum和preferred size
Content Size Fitter通过同一个物体上的LayoutElement信息，控制Rectangle Transform。
在Rect Transform被设置后，Horizontal Layout Group确定位置并根据一些设置的属性设置大小。

Make children of a Layout Group fit their respective sizes
如果Layout Group想控制子物体的位置等，就不能直接在子物体上添加Content Size Fitter来解决这种问题。Layout Group可以让子物体适应其自己的内容，只需要将child force expand的toggle取消勾选。
一旦子物体不再随着宽度随意拓展，可以在Child Alignment setting中设置他们的对齐方式。
如果想让Layout Group中一部分的子物体随着宽度变化而进行变化，而一部分不进行变化，那么在需要变化的子物体上添加组件Layout Element，勾选Flexible width或者Flexible Height属性。Layout Group仍然信用Child Force Expand toggles。
原理：
如果游戏物体上有多个可以提供layout information的组件，可以使用layout element组件对其他组件进行覆盖。
Layout Group接收来自子元素提供的信息，这将重写可变大小。之后当控制子物体大小时，layout group不会使他们超过preferred大小。如果Layout Group中Child Force Expand选项被选中，那么子物体的可变大小将至少是1

世界空间UI的创建

设置Canvas到世界空间
选择Canvas的渲染模式为世界空间，这时全部的摄像机都可以看见他们
决定Canvas的分辨率
输入Rect Transform的width和height的值控制分辨率。
确定Canvas在世界中的大小
如果想确定宽度到米，可以计算meter_size / canvas_width
eg：For example, if you want it to be 2 meters wide and the Canvas width is 800, you would have 2 / 800 = 0.0025.
Canvas的位置
世界空间下的Canvas可以被放置在人任何位置。

通过脚本创建UI元素

创建一个UI元素的预制体
动态的创建UI元素的第一步就是创建一个要实例化的UI元素的预制体
实例化UI元素
实例化UI元素与实例化其他游戏物体一样，使用Transform.SetParent方法设置父物体，并且worldPositionStays参数为false
定位UI元素
UI元素通常通过Rect Transform进行位置设定，如果父物体由LayoutGroup，那么位置的设定将跳过。
定位Rect Transform的时候，第一件事时判断是否有拉伸行为。anchorMin和anchorMax不同的时候，将发生拉伸行为。
没有拉伸行为的Rect Transform，它的位置将简单的通过anchoredPosition和sizeDelta属性进行设置。
对于拉伸了的Rect Transform 来说，通过offsetMin和offsetMax对位置进行设定，offsetMin设定左下角到做下锚点的距离，offsetMax设定右上角到右上锚点的距离。

UI Screens 转换

不同的UI界面转换时很常见的，下面解释了一种简单的屏幕转换的方式使用Animation和状态机实现和控制没有屏幕