Unity新UI系统概述——Interaction Components

这个章节会讲解UI系统中能用鼠标或触摸进行交互，还有用键盘或控制器交互的组件。

可选组件的基本类型

所有可交互的组件都有一些共通的地方。他们都可以被选中，这意味着他们有共享的内建功能，这些功能用于不同状态时可视化的转换，而且可以使用键盘或控制器切换到其它可选择的组件上。这里是需要这些共享的功能的。

在一个可选的组件里有一些根据当前可选择状态转而不同的转换选项。这些状态是：normal（普通）, highlingted（高亮）, pressed（按下）和disabled（禁用）。

相关的转换选项有：

ColorTint - 根据状态改变按钮的颜色，有可能可以为每一个状态提供一个颜色。也可以为不同的状态设置一个Fade Duration（渐变持续时间）。数值越大，颜色之间变化的越慢。

SpriteSwap- 允许为不同的状态设置对应的精灵，精灵可以自定义。

Animation- 允许为按钮状态设置相应的动画，为了使用动画转换功能必须要使用animator组件。请注意确保root motion是禁用的。可以点击generate animation或手动创建animation controller，然后确保将controller设置到了按钮的animator组件上。请参看UI系统概述——Animation Integration文档。

None- 这个选项用于没有任何效果的按钮

 

Navigation选项用于运行模式下UI元素的导航是如何被控制的。

Button（按钮）

按钮含有一个OnClick功能的选项，用来定义被点击后按钮将会做什么。在右下角的"+"号可以增加一个委托；第一段用于提供函数的选中对象，接下来的一段用于选择函数，最后的用于变量，会根据具体选择的函数相关。

附在按钮上的标签含有一个Text组件，为了允许在设计和自定义方面有更多的自由，这个标签和按钮是分开的。它可以设置先的文本、字体、字体风格、字体大小、文本颜色和是否要显示富文本。

Toggle（开关）

Toggle含有一个Rect Transform组件，一个Image组件和一个Toggle组件。它也有一个含有RectTransform组件和Text组件的子标签对象。Toggle含有额外的两个Image对象，分别用于显示“开”和“关”两种状态的背景图片。

IsOn复选框决定当前状态是开还是关。

ToggleTransition可以用来设置开和关之间变换是否要渐隐。

Graphic选项用于改变开关背景到一个更合适的图像，如果选择了ColorTint模式，颜色改变的时候会被影响到。

OnValue Changed的设置和Button的OnClick是类似的。

Toggle Group（开关组）

开关组可以用来将多个Toggle成组。属于同一个组的开关会被约束到同时只有一个能被选择——选择了其中一个就会自动反选其它的。

下图显示了一个开关组的效果：一个开，而其他的都关。

开关组通过将Toogle Group对象拖动到Group域中来创建，组中的每一个Toogle都要设置。开关组对于在一个所有项目都互斥的列表是很有用的。

Slider（滑块）

Slider对象可以使竖直或水平的，它有一个叫做FillArea（填充区）的子对象，这个子对象自身也有一个叫做Fill的子对象。Fill对象的transform值是被它的父对象transform驱动的，因此它不能超过Slider对象的范围。

Direction用来为水平滑块设置为从左到右还是从右到左变化，或者为竖直滑块设置为从上到下还是从下到上变换。

你可以设置在Min Value和Max Value域设置最小和最大的滑块值。如果Whole Numbers勾选了，滑块只有当值为整数时才会移动。Value为滑块所在位置的当前值。

如果要在滑块改变时调用脚本，在On Value Changed域中设置。

Scrollbar（滚动条）

滚动条对象也可以是竖直或者水平的。它有一个叫做Sliding Area的子对象，这个子对象又有一个叫做Handle的子对象。Handle对象的Transform值是被它的父对象驱动的，因此它不能超过Scrollbar对象的范围。

HandleRect定义了滑块的样子，默认下它被设为叫做Handle的子对象。Direction用来为水平滚动条设置为从左到右还是从右到左变化，或者为竖直滚动条设置为从上到下还是从下到上变化。

Value用来设置开始滚动条的位置，而滚动条的大小由Size来设置。步数量用Numberof Steps来设置，例如：3表示滚动条会显示0%、50%和100%。

通过On Value Change域可以让滚动条改变时调用指定脚本。

Scroll Rect（滚动区域）

当一个大的图像或者一大组UI控件需要显示在一个小区域内时，就需要使用滚动区域。滚动区域提供了滚动图像或其它UI元素的功能，它可以含有滚动条，也可以没有。为了创建滚动视图，通常它会在父Rect Transform里联合使用Mask和Image，在视图内只有可滚动的内容才可见。

在层级窗口中，应该像这样安排对象：含有Scroll Rect的Rect Transform同时也需要添加Mask组件。下图中这个对象叫做ScrollView。

ScrollView的子对象应该只含有RectTransform组件，它作为所有可滚动内容的父对象。下图中这个对象叫做Content。这个对象也需要被拖到ScrollRect组件的Content属性上。

滚动区域还可以链接一个水平和/或一个竖直滚动条。典型来说，可以把滚动条对象放在ScrollView相邻的位置，然后分别拖到Scroll Rect的Horizontal Scrollbar和Vertical Scrollbar属性上。注意正确设置滚动条的Direction属性。

Input Field（输入域）

输入域可以让Text控件可编辑（详见官方参考文档中的Text控件）。

 

一个添加了可编辑的插入符号的文本控件