关于UGUI那些事儿

时间  2021-01-05

UGUI是什么？

UGUI是Unity的UI实现方式，在UGUI中，其根容器为Canvas，在创建UI到场景中，都会默认生成Canvas以及EventSystem，UGUI的UI对象必须作为Canvas的一个子物体才能显示在屏幕上，Canvas是占满整个摄像机内容的。Event Sysytem作为UI事件系统也是必不可少的，否则UI物体的事件处理无效。

1.Canvas属性:
Render Mode:渲染模式，
（1）Screen Space-Overlay：2DUI,始终显示在屏幕最前方。
（2）Screen Space-Camera:2D及3DUI，绑定到指定摄像机，可显示3D内容，同时UI可以进行3D方面的旋转，UI可以获得3D效果。
（3）World Space：3DUI，存在3D空间中的UI。
Pixel Perfect：是否已像素的方式显示UI。
Sort Order：不同Canvas之间的前后的显示排列设置。
UI Scale Mode：UI缩放模式，
（1）Constant Pixel Size：像素大小始终不变，即一张100100的图片在任何的分辨率下都占用100100的像素。
（2）Scale With Screen Size：不关心图片的实际像素的大小，而只关心Width及Height值，这个值如果是1000，那么100高度的图片在任何分辨率下都只占用屏幕1/10的尺寸。一般移动端会使用这种方式，因为移动端分辨率差异较大。
（3）Constant Physical Size：根据物理单位来进行缩放。
Graphic Raycaster：场景中的射线调整，用于交互事件的配置。
2.作为UI显示的GameObject中是使用Unity3D专门为UI组件设计的Rect Transform组件。如图所示。
在这里插入图片描述
参数如下：
在这里插入图片描述
Anchor
Rect Transform除了上面提到的功能外，还提供了描点功能，该功能主要实现相对布局的功能。
还可以点击在这里插入图片描述直观的配置描点
表示是否忽略掉物体的旋转。点开不能对物体进行旋转。
表示当修改Anchor时UI的位置及尺寸是否会根据Anchor进行匹配，点开可以进行匹配。

Button：
在该过程中创建一个Button，Button按钮是由两部分组成的，一个是Button，还有一个是Text，点击Button物体，在检视视图上会出现如图所示的界面。
在这里插入图片描述
Button组件中的属性
Interactable：该按钮是否启用。
Transition：按钮状态变化模式。
Color Tint:通过Color属性对按钮四个状态进行设置，来区分不同的状态。
Sprite Swap：通过精灵来区分不同的状态
Animation：（UGUI特色）可以使用动画状态机来设置按钮的状态，可以改变大小、缩放、旋转、图片。
Normal Color：正常颜色
Highlighted Color：增加亮度的颜色
Pressed Color：按压后的颜色
Disabled Color：未激活的颜色
Color Multiplier：颜色的乘积
Fade Duration：褪去的持续的时间
Navigation：导航，使用键盘方向键切换选中按钮时的切换顺序
Visualize：可视化，使Navigation顺序在Scene窗口中可视化

Text：
创建一个Text，text在检视视图上的属性如图所示
在这里插入图片描述
Text中的属性介绍如图所示
在这里插入图片描述
Horizontal Overflow：水平溢出方式
Align By Geometry：对于几何学是否对齐
Best Fit：最佳适配

Image：
创建一个Image，然后选中Image，在检视视图上会显示Image属性，如图所示。

在这里插入图片描述
Source Image：选择图片的
Color：给图片选择颜色
Material：材质
Raycast Target：光线投射目标
Preserve Aspect：是否保持图片长宽比
Set Native Size：设置图片为原有的大小

当从网上下载一个图片时，把该图片加入到工程中，放到Assets下，然后点击图片，这时在检视视图上会出现图片的属性，如图所示

在这里插入图片描述
这时需要修改图片属性Texture Type，要选择Sprite(2D and UI)，如图所示
在这里插入图片描述
最后点击Apply按钮，把形成的图片放到Image属性的Source Image下即可。

先介绍这么多。。。。下次见。。。 各位好好加油吧，明天的曙光会更美。。。

联系我们 沪ICP备13005482号-10