UGUI——基本组件

UGUI

UGUI指的是Unity中的UI处理。GUI通常用于一些Debug调试。相比于NGUI,UGUI增加了渲染顺序，自动为我们省去了图集的操作，只需要更改Sprite类型即可。最重要的是屏幕自适应，对于不同型号的屏幕如何变化UI控件。

Text

动态字体：用于实时生成，比如聊天打字等。

静态字体：使用Unity3D的静态字体需要先制作静态字体库，可以借助BMFont 这个工具来生成字体图集和UV信息，得到png图片和fnt文件。

SDF字体：矢量字体，当界面放大或者缩小的时候，不会出现模糊。普通字体是记录UV坐标，生成纹理，SDF是记录距离轮廓的距离，并且在缩放的时候进行插值。轮廓内的填充颜色，轮廓外的不填充。并且可以一张问题存储多个SDF字体。

字体花屏：UV坐标当屏幕缩放的时候并不适用，所以要监听事件，当文字太多放不下的时候，要适用FontTextureChanged方法进行重建，刷新所有文本。

Image

Image：只能显示Sprite，有Sliced和Tiled、Filled多种样式。但是Sprite使用前必须要把图片资源修改格式。

Raw Image：既可以显示Sprite，又可以显示Texture，但是Raw Image仅仅是将原始的图片挂上去，初始化速度比较快。

Sprite：精灵图集，Image可以使用，Sprite会自动去除透明像素，这样一张矩形图，六个顶点会生成更多的顶点。计算变得复杂，但是在光栅化阶段会加快，因为像素少。

Sprite Atlas：精灵图集，可以将多个图片素材进行合并批次。

Image(sliced)：九宫格，可以在sprite资源中设置格点，当图片被拉伸的时候，是在九宫格的部分拉伸，在九宫格外部的内容会保证原尺寸。

Image(tiled)：平铺，当宽度拉伸二倍，水平方向复制一个同样的Image，同理，高度也会复制。

Image(filled)：填充，可以选择填充的方向以及填充的比例，比如比例为0.5，那么Image会制成一个从左到右显示半个Image的动画

Canvas

Canvas是画布，所有的UI组件都默认添加在Canvas下面。我们希望解决的很重要的一个问题是屏幕自适应。

屏幕分辨率：屏幕上横向有多少像素，纵向有多少像素。
Cavas(height/width)：同样表示画布横向纵向有多少像素。

当屏幕的分辨率扩大一倍的时候，画布的分辨率跟着扩大，但是画布下的组件不会扩大，也就是说，屏幕分辨率越大，像素排列的密度更加紧凑，原有组件像素不变，排的更紧凑，看上去就更小了。

我们使用Canvas Scaler，其中有缩放比例，这个缩放比例我的理解是，不是说分辨率两个像素，定义画布一个像素，仅仅是影响宽高的值。而是说屏幕允许画布以一个像素显示两个像素。所以当分辨率扩大一倍的时候，画布如果缩放因子是2，画布就会保持不变。

我们可以实时的获取Scale Factor，通过获取屏幕分辨率和参考屏幕尺寸获得。同时Canvas Scaler的Scale With Screen Size模式下，会根据设定好的参考标准宽度（高度），计算出Scale Factor，然后去计算Canvas的高度（宽度）。

Anchor

锚点是用于子物体和父物体的相对位置，定义我们UI元素的矩形框的四个顶点分别到锚点的距离始终不变