unity3D UGUI学习 (一) canvas 和 RectTransform

前言

UGUI是unity公司请NGUI制作团队来制作的unity内置的UI组件。

学习UGUI,可以先和NGUI做个比较区别,
1. NGUI有图集,UGUI没有图集的gain
2. NGUI有Depth,UGUI没有Depth深度的概念,
但UGUI根据在Canvas层次可以自上往下增长的顺序展示
可以通过代码SetSiblingIndex(int index)修改展示顺序
3. NGUI的panel裁切Clip UGUI裁切Mask
4. UGUI有些控件可以添加材质
5. NGUI中Anchor自定义 UGUI中Anchor是相对于父物体
6. UGUI有屏幕坐标系和世界坐标系
7. UGUI使用的是当前的相机

接下来对每个UGUI组件,UI对象进行学习

Canvas

Canvas对应NGUI的UI Root ,不能移动位置,可在这做屏幕适配。
unity3D UGUI学习 (一) canvas 和 RectTransform_第1张图片
ScreenMatch就是按宽或是按高做适配
Match是调整是否按宽或高做适配,如果在中心就是按宽和高适配,

EventSystem

提供UGUI中所有的事件系统,如果去掉,按钮,输入的事件功能都不能使用

需要知道的常用内容 RectTransform组件

这里创建一个Text为例,有RectTransform组件
unity3D UGUI学习 (一) canvas 和 RectTransform_第2张图片

pos 就是UI对象的位置,(是根据中心点位置)
Width Height 就是UI大小
Rotation 和Scale也容易知道是物体旋转角度和物体比例大小

这里主要是要知道Anchors和Pivot属性

Pivot : 0 - 1 控件的中心点,0.5,0.5表示就是正中心。可以改变为 x y 属性值为1 然后把pos都设置为 0 0 0 查看他们的区别

Anchor和NUGI的Anchor使用有点区别,但是实际作用都差不多,区别是Anchor的值都是相对于父类计算的
使用时点击田字图
然后选(点击)一个方向,此时可以把UI对象移动此处,转换屏幕比例,此时UI对象还是在这个方向不会移动。
unity3D UGUI学习 (一) canvas 和 RectTransform_第3张图片
图中表示的是该物体对象的Anchor是左中方,这时候该UI对象物体在左中方的都不会因为屏幕大小的改变而移动。

然后返回看Anchor属性的值也变化了。就不用自己手动去调整,比NGUI使用要调整4个方向要好用

按住Alt键再点击会自动把UI对象放到位置上
Stretch 是拉伸控制,拉伸后图像会随屏幕大小变化而做拉伸放大缩小,如果按住Alt键,就会把该物体给拉伸铺满。此时如果要修改,需要改它的pos,Width, Pivot。多操作就知道。并且要设置Pivot坐标显示。

unity3D UGUI学习 (一) canvas 和 RectTransform_第4张图片
如此时就设置的
设置Anchor为左上角方向
Pivot 值是x = 0 y = 1
pos 是 0 0 0
Width 是100 Height 是200

另外补充

unity3D UGUI学习 (一) canvas 和 RectTransform_第5张图片

你可能感兴趣的:(UGUI)