学习Unity 4.6新GUI系统

（搬运自我在SegmentFault的博客）

最近在学习Unity的过程中，自己做一款小游戏自娱自乐。自然需要用到GUI。但4.5中的GUI很难用，一个选择是传说中的NGUI插件。但对于4.6中的新GUI，我也有所耳闻。想了想还是选择官方的技术较好，于是就有了这篇。

Canvas

在新GUI中，所有的UI组件都位于Canvas上。Canvas有三种渲染模式：

Screen Space - Overlay：将UI放置在场景的上面，调节场景大小或调整分辨率，则Canvas也会随之调整。
Screen Space - Camera：Canvas由一个特定的相机渲染，相机的设置会影响UI。
World Space：使Canvas像场景中的其他对象一样渲染。

Rect Transform

所有的UI元素都使用矩形来表示。

Rect Transform是为UI设计的新transform组件。除了普通transform组件的position、rotation、scale之外，还增加了width和height。

Update：两种编辑模式：

Blueprint：在此模式下，物体不会旋转和缩放。
Raw Edit：在此模式下，调整物体的Pivot和Anchor不会改变物体的位置和尺寸。

Rect Tool

4.6的工具栏中加入了新的小工具Rect Tool，用于调整UI和2D对象。使用这个小工具，就可以完成移动、调整大小、旋转等工作。

当使用Rect Tool调整对象的尺寸时，如果是2D或3D对象，他会调整其scale；而对于有Rect Transform的对象，则会调整其width和height。

Update：Resize和Scale的区别：前者不影响字体大小；后者可以设置负值，相当于将物体反过来，前者不允许负值。

当切换至Pivot模式，可以调整其pivot。再次点击切换回Center模式。

Anchors

Rect Transform中增加了Anchors属性，其中包括Anchor Min和Anchor Max。Anchors用于指定在父UI元素调整时，子UI元素如何调整。具体行为由Anchor Min（左下）和Anchor Max（右上）两个锚点决定。坐标以矩形左下为(0, 0)，右上为(1, 1)。

但实际上，Unity已经提供了预定义的模式。在Rect Transform的左上角点击，出现如下的常用Anchor模式。

以top-left模式为例，此时锚点位于父元素的左上角。如果拉动父元素矩形的左边框和上边框，则子元素的位置也随之变化。而拉动另外两条边则不发生变化。

在middle或center模式下，拉动轴两侧的边子元素均会随之移动。

此外还有stretch模式，在拉动时会拉伸或压缩子元素。

新的组件

Text：也就是Label。

Image

RawImage：与Image不同之处在于，Image的参数是Sprite，而RawImage的参数是Texture。

交互

交互组件都有一个transition属性，用于实现组件在不同状态下产生不同的变化。有三个选项：

Color Tint：改变颜色。有一个Fade Duration的参数控制变化的时长。
SpriteSwap：不同状态下展示不同的Sprite。
Animation：由一个动画控制器来决定显示。不同状态下触发不同的事件。
None：没有变化。

Button提供了OnClick属性，可以为按钮添加响应。点击加号，可以添加一个委托。

其中有三个空，第一个表示目标对象，第二个表示要选用的函数，第三个是对应的参数列表，由前两项决定。

以点击按钮改变按钮的文字为例。第一个就是Button下的Text对象，第二个是Text.text，第三个则是你要改变为的内容。

此外还有其他的控件，如Toggle、Slider、ScrollBar、Selection List。

自动布局

一些更加复杂的布局技术，暂时没有这个需求，就不看了。

动画集成

这部分文档没写，囧。

富文本

Rich Text在新的GUI系统中默认是禁用的，但是可以通过GUIStyle来使用：

GUIStyle style = new GUIStyle ();

style.richText = true;

GUILayout.Label("<size=30>Some <color=yellow>RICH</color> text</size>",style);