Canvas
Canvas 使用 EventSystem接收消息 Messaging System.
Draw order of elements
UI elements 按照它们的order，决定在屏幕上绘制的顺序. 绘制order从小到大绘制，越小的越在下面
或者在 Hierarchy 中拖拽他们的层级. order 还可以通过 Transform component
: SetAsFirstSibling(作为父物体的第一个子物体，渲染在最底层), SetAsLastSibling（作为父物体的最后一个子物体，渲染在最上层）, and SetSiblingIndex（自己决定是第几个子物体）.方法修改
Render Modes
Canvas 的 Render Mode 设置，决定UI是渲染在 屏幕空间还是世界空间screen space or world space.
Screen Space - Overlay
渲染在场景的最上面 scene.如果屏幕调整大小或改变分辨率，Canvas （这里的是canvas，没说ui元素，所以这并不能自适应分辨率）画布这个将自动改变大小以匹配这一点。
Screen Space - Camera
这类似于 Screen Space - Overlay, 这种会把 Canvas放在指定摄像机的前面一段距离
UI elements 通过指定摄像机渲染 camera, 也就是说该摄像机的设置影响UI的渲染 ，如果摄像机Camera是 Perspective, UI 会通过透视渲染 perspective,透视变形的大小可以通过Camera的 Field of View控制. 如果屏幕调整了大小，改变了分辨率，或者相机的截距改变了，画布也会自动改变大小以匹配。
通过距离改变canvas与摄像机的距离,也就是说任何与摄像机的距离比canvas小的物体都可以渲染在ui前面，比如
World Space
Canvas 和场景中的游戏物体一样. Canvas 的大小通过 Rect Transform设置, UI元素将基于3D布局呈现在场景中其他对象的前方或后方. 这对于要成为世界一部分的ui非常有用。这也被称为“固定界面”。
Basic Layout：基础布局
The Rect Tool
通过Rect Tool in the toolbar， Rect ToolRect工具既可以用于Unity的2D功能，也可以用于UI，事实上，它甚至可以用于3D对象
当操作 UI 时，通常保持 Pivot and Local.
Rect Transform
Rect Transforms 与Transform一样，RectTransform具有位置、旋转和比例，但它也具有宽度和高度，用于指定矩形的大小。
Resizing Versus Scaling
当 Rect Tool 用来改变一个对象的大小时，对于2D系统中的Sprites和3D对象，它会改变对象的local scale 局部大小，但是，当它被用于带有Recttransform的对象时，它将改变宽度和高度，保持scale不变。这种调整不会影响字体大小、切片图像的边框等等。
Pivot
中心点
Anchors
锚点，由四个三角形组成，作用就是锚点和中心点的距离不会变，不管分辨率或屏幕怎么改变
锚点的设置方式：
按住 Shift 拖动锚点, UI 的边缘会随着一起动
Anchor presets
预置的锚点：
Anchor and position fields in the Inspector
Anchor Min左下角, and Anchor Max 右下角
当所有的锚柄在一起时，显示的字段是 Pos X, Pos Y, Width and Height. Pos X和Pos Y值表示pivot相对于anchors.的位置。
当锚点四处分开时，显示成Left, Right, Top and Bottom. 它们定义矩形内部的内边距，通过锚点来定义. The Left and Right fields are used if the anchors are separated horizontally and the Top and Bottom fields are used if they are separated vertically.
请注意，更改锚点或枢轴字段中的值通常会反调整定位值，以使矩形保持在适当的位置.在不需要的情况下，通过点击检查器中的R按钮来启用 Raw edit mode. 这样更改锚点和轴心值，而不会导致任何其他值更改. 这可能会导致矩形在视觉上移动或调整大小，因为它的位置和大小取决于锚点和枢轴值
就是点击R，更改锚点或者中心点，recttransform的本身位置不会发生变化
比如：
变成
位置没变
没选，位置就会发生变化，因为锚点和中心点控制位置，勾选中心点不懂，不勾选中心点动，背景不动，但是中心点一动，位置就变了
Visual Components
Text
Image
material 也可以添加到 Image component. Image Type图片类型可以定义sprite 的方式:
-
Simple - 均匀地缩放整个精灵 sprite .
-
Sliced - 使用3x3的精灵分割，这样调整大小不会扭曲角落，只有中心部分被拉伸.
-
Tiled -平铺
-
Filled - 以与Simple相同的方式显示精灵，只是它可以定义填充的方向，方法，和数量
在 Simple or Filled 选中时，Set Native Size,重置 image原始大小
I通过从“纹理类型”设置中选择Sprite(2D / UI)，可以将图像导入为UI精灵。与旧的GUI精灵相比，精灵有额外的导入设置sprite editor. prite编辑器提供了9-切片图像的选项，这将图像分割成9个区域，这样如果sprite被调整大小，角落就不会被拉伸或扭曲。
Raw Image
Raw Image 可以使用 texture (no borders etc). image 使用sprite
Mask
遮罩，让子物体只显示父物体的一部分.
Effects
由outline shadow
Interaction Components
本节介绍UI系统中处理交互的组件，例如鼠标或触摸事件以及使用键盘或控制器进行交互。
交互组件本身是不可见的，必须与一个或多个 visual components可视组件组合才能正确工作。, and must be combined with one
Common Functionality
交互组件至少有一个UnityEvent，当用户以特定的方式与组件交互时调用该UnityEvent。UI系统捕获并记录任何从附加到UnityEvent的代码中传播出来的异常
Button
OnClick UnityEvent 点击时的操作
Toggle
Toggle有一个Is On复选框，用于确定Toggle当前是打开还是关闭. OnValueChanged UnityEvent定义当值改变时它将做什么。
Toggle Group
Toggle Group 让一组 Toggles 互斥. Toggles 在同一个Toggle Group下，同一时刻只能选中一个
Slider
滑块有一个十进制数字值，用户可以在最小值和最大值之间拖动.可以是水平的，也可以是垂直的，OnValueChanged UnityEvent 定义当值改变时它会做什么。
Scrollbar
A Scrollbar 有一个小数 Value between 0 and 1. 当用户拖动滚动条时，值也随之改变
Scrollbars 经常和 Scroll Rect and a Mask 一起来创建滚动视图. Scrollbar的Size 值在0-1之间来决定 handle的大小
OnValueChanged UnityEvent 定义当值改变时它将做什么。
Dropdown
A Dropdown 有可供选择的选项列表. 可以为每个选项指定文本字符串和可选的图像，可以在Inspector检查器中设置，也可以从代码中动态设置. OnValueChanged UnityEvent 定义当当前选择的选项被更改时它将做什么。.
Input Field
输入框，有两个unityevent
Scroll Rect (Scroll View)
A Scroll Rect 当占用大量空间的内容需要在一个小区域中显示时，可以使用它。滚动条提供了滚动该内容的功能。
通常，滚动矩形与遮罩相结合以创建滚动视图，其中只有滚动矩形内的可滚动内容可见。它还可以与一个或两个滚动条相结合，可以水平或垂直拖动滚动条
Animation Integration
需要一个Animator Controller 点击 “Auto Generate Animation”. 会自动生成，同时也会生成相应的animation
通过(Window>Animation).窗口来编辑这些动画
There is an Animation Clip
pop-up menu to select the desired clip. Choose from “Normal”, “Highlighted”, “Pressed” and “Disabled”.
可以通过红点来记录动画
- Select the record Button
- Change the width of the Button in the inspector
- Exit the record mode.
Auto Layout
Rect Transform 布局系统足够灵活，可以处理许多不同类型的布局，它还允许以完全自由的方式放置元素. 然而，有时可能需要一些更结构化的东西。
自动布局系统提供了在嵌套布局组中放置元素的方法，例如 horizontal groups, vertical groups, or grids. 它还允许根据所包含的内容自动调整元素的大小.例如，可以动态地调整按钮的大小，使其完全适合文本内容。
Understanding Layout Elements
自动布局系统是基于 layout elements and layout controllers的概念. A layout element是一个带有Rect Transform的游戏对象，也可以包含其他组件. Layout elements 不要直接设置它们自己的大小，但是作为布局控制器的其他组件可以使用它们提供的信息来计算要使用的大小。
A layout element 有定义自己的属性:
- Minimum width
- Minimum height
- Preferred width
- Preferred height
- Flexible width
- Flexible height
使用layout elements提供的信息的layout controller组件的示例如下： Content Size Fitter和各种 Layout Group components. 布局组中的布局元素如何调整大小的基本原则如下:
- 首先分配 minimum sizes .
- I如果有足够的可用空间, 分配 preferred sizes .
- 如果有额外的可用空间, 分配flexible size .
所有有 Rect Transform组件的物体都可以被当作一个layout element. 他们将默认有minimum, preferred, and flexible 大小为0.
The Image and Text components是提供 layout element属性的两个组件. 它们改变preferred width and height 去匹配 sprite，text content.
Layout Element Component
如果你想覆盖 minimum, preferred, or flexible size,添加Layout Element 组件 Game Object.
Enable 要重写的属性的复选框，然后指定要用其重写的值。
Understanding Layout Controllers
. A layout controller一个布局控制器可以控制它自己的布局元素(与它自身的游戏对象相同)，也可以控制子布局元素。
作为布局控制器的组件本身也可以同时作为布局元素。
Content Size Fitter
Content Size Fitter 它控制自己布局元素的大小. 查看自动布局系统运行情况的最简单方法是add a Content Size Fitter component to a Game Object with a Text component.
设置 Horizontal Fit or Vertical Fit 为 Preferred, the Rect Transform 将调整其宽度和/或高度，以适应文本内容
Aspect Ratio Fitter
Aspect Ratio Fitter功能类似于一个布局控制器，它控制自己布局元素的大小。
它可以调整高度以适应宽度，反之亦然, 或者，它可以使元素适合它的父元素，或者将它的父元素封装起来。
Layout Groups
可以控制子ui的位置和大小，不能控制它们自己的大小，但可以被其他layout controller控制
Technical Details
layout system 拥有内置的组件，但是也可以自己创建组件, 需要继承layout system.的接口
Layout Interfaces
A component被当作 layout element 继承接口 ILayoutElement.
A component 被当作group，管理Rect Transforms ，继承 ILayoutGroup.
A component 管理自己 额 RectTransform ，继承 ILayoutSelfController.
Layout Calculations
The auto layout system evaluates and executes layouts in the following order:
- The minimum, preferred, and flexible widths of layout elements are calculated by calling CalculateLayoutInputHorizontal on ILayoutElement components. This is performed in bottom-up order, where children are calculated before their parents, such that the parents may take the information in their children into account in their own calculations.
- The effective widths of layout elements are calculated and set by calling SetLayoutHorizontal on ILayoutController components. This is performed in top-down order, where children are calculated after their parents, since allocation of child widths needs to be based on the full width available in the parent. After this step the Rect Transforms of the layout elements have their new widths.
- The minimum, preferred, and flexible heights of layout elements are calculated by calling CalculateLayoutInputVertical on ILayoutElement components. This is performed in bottom-up order, where children are calculated before their parents, such that the parents may take the information in their children into account in their own calculations.
- The effective heights of layout elements are calculated and set by calling SetLayoutVertical on ILayoutController components. This is performed in top-down order, where children are calculated after their parents, since allocation of child heights needs to be based on the full height available in the parent. After this step the Rect Transforms of the layout elements have their new heights.
从上面可以看出，自动布局系统首先计算宽度，然后计算高度。因此，计算的高度可能依赖于宽度，但计算的宽度不能依赖于高度。
Triggering Layout Rebuild：刷新布局
当组件上的属性发生变化，可能导致当前布局不再有效时，需要重新计算布局。这可以通过调用来触发:
LayoutRebuilder.MarkLayoutForRebuild (transform as RectTransform);
：重建不会立即发生，而是在当前帧的末尾, 在Rendering发生前. 它不是即时的原因是，这可能会导致在同一帧中多次重建布局，这对性能不利。
何时应触发重建的准则：
- 在setter中设置可以更改布局的属性。
- 在下面的方法中:
- OnEnable
- OnDisable
- OnRectTransformDimensionsChange
- OnValidate (only needed in the editor, not at runtime)
- OnDidApplyAnimationProperties
Rich Text
.Rich text支持 UI System和 legacy GUI system. The Text, GUIStyle, GUIText and TextMesh 类都有富文本的设置方式. The Debug.Log 中也可以使用.
Supported tags
