UGUI基础篇 第(3)课: RectTransform组件常用小技巧与困惑知识点讲解

一. Debug调试模式以及RectTransform两种位置属性的关系

1.Debug调试模式介绍

Debug模式用于查阅隐藏在组件内部，不在编辑器公开显示的属性。如AchorsPosition ，LocalPosition这些处于
RectTransform的并不在编辑器显示的属性。

开启方式：如图所示，点击红色箭头的尾部 （哈哈，没想到把，在尾巴处，不在箭头指向处）

之后：选择Debug模式，就会显示RectTransform的属性面板，这样我们测试开发起来会更加方便。

2.RectTransform两种Position属性的讲解(Anchored Position与Local Position)

在Debug模式下，我们有许多RectTransform的隐藏属性参数可以查阅。
下面我主要讲解一下容易造成误解的两个属性参数：(Anchored Position与Local Position)
从本质区别上Local Position是Vector3类型，继承自Transform，Anchored Position是Vector2类型，继承自RectTransform
但是我们往往在使用时发现他们的X，Y的数值是一样的，（请看演示1）其实他们也会有不同的时候，我将用案例给大家讲解一下他们在UGUI
中使用的区别之处。

演示1：在一个UI的Pivot与锚点重合的情况下（蓝色圆环与4个锚钉围成的锚点位置相同，或者查看Anchor 的x，y的min，max是否是相同的，且都对应与Pivot x，y的数值），Anchored Position与Local Position的X，Y 数值相同。请看图 1-2-1；

                                                                                   图1-2-1

演示2：在一个UI的锚点不在父物体的几何rect(矩形区域)中心情况下（图1-2-2），或者说4个锚钉之间只要有分开的情况下（图1-2-3），两个值都不会相同。

                                                                     上面两图为1-2-2

                                                           上面两个图为1-2-3

演示3：此时我们拖动物体，我们发现物体的Pivot(枢轴点)与Anchors锚点的距离为(563,-74）,利用其他UI物体测量，该UI距离父物体的
rect（矩形区域）的中心位置为（-110，-74），请观看 图1-2-4。

                                                                   上面两个图为1-2-4

---

	于是：我们得出结论：
	Anchored Position:      在UGUI使用中代表物体pivot相对于Anchors锚点图像(4个锚钉构成的区域)的几何中心点的位置。
	Local Position：         在UGUI使用中代表的是物体pivot相对于父物体的rect(矩形区域)的几何中心点的位置。

3.SizeDelta属性讲解

sizeDelta介绍：sizeDelta的值就是OffsetMax-OffsetMin的值
所以就会出现有时候sizeDelta得到的是UI元素的大小，有时候又不是的情况，下面就复现一下这两种情况

1. 锚点情况下的sizeDelta
   
   -----在锚点情况下，offsetMax和Min的起点相同，根据向量相减的三角形法则（不记得是不是这样说得了哈哈哈），可以得到一个新的向量，这个新的向量的X和Y的大小正好UI元素的宽和高相等，所以在这个时候去设置sizeDelta的值，可以直接调整UI元素的大小

---

2. 锚框（4个锚钉有分开的情况下）情况下的sizeDelta
   
   -----在锚框（4个锚钉有分开的情况下）的情况下，offstMax减去Min，得到的将不再是UI元素的大小，而是一个新的奇怪的向量，这个向量代表的物理意义是，sizeDelta.x值就是锚框的宽度与UI元素的宽度的差值，sizeDelta.y的值就是锚框的的高度与UI元素的高度的差值。

二. 利用定位快捷键AnchorPreset快速定位

介绍：定位快捷键AnchorPreset是Unity对于Anchors图形化面板进行直接定位的快捷方式

快捷键 Shift：在选中锚点定位位置时，同时设置Pivot。
快捷键Alt：在选中锚点定位位置时，同时设置UI position。

 同时：可以同时按下Shift与Alt，进行同时设置Anchors锚点，Pivot与Position。

三. 获取RectTranform宽高的最安全的方式

1. 问题需求： 有些时候，我们使用Anchors锚点定位时，选择的为Stretch定位方式（解释为拉伸定位，或弹性定位），我们往往看不到当前UI的Width或Height，出现的为Left，Right，Top，Bottom面板 (请看下图 3-1) ，此时我们利用Debug调试模式查看SizeDelta发现也是不合理的（关于SizeDelta属性的讲解在上面）.

                                                                           图3-1

---

2.解决办法：此时最安全的办法就是脚本获取当前Image物体的RectTransform.rect 结构体，获取结构体的属性值（width，height）；

原理：请看下图 (3-2) 代码注释

    private RectTransform myRectTransform;
    void Start()
    {
        myRectTransform = gameObject.GetComponent<RectTransform>();


        //myRectTransform.rect     指当前UI物体的所拥有的矩形区域（结构体类型）
        //rect.width，rect.height  分别代表当前UI物体的矩形区域的宽高
        Debug.Log(myRectTransform.rect.width + " ----" + myRectTransform.rect.height);
    }

---

Console输出结果：下图（3-3）

                                                        图3-3

四. Blueprint mode 与 Raw edit mode介绍

前言 ：我们最往往忽略也不经常使用的RectTransform的两个模式： Blueprint mode 与 Raw edit mode

两个模式开启关闭位置：如图 4-1

                                                      图4-1-1

---

之后我来向大家讲解两种模式的用处。。。。。。（好啦，看下面）

---

1. Blueprint mode作用

Blueprint mode作用：当我们对UI 进行缩放旋转时，我们的UI物体的Rect白框都会自动包含住我们的UI物体，请看图4-2到4-3的变化,
当我们开启Blueprint mode，我们的UI物体的Rect白框一直处于原始状态，不会随着UI物体的缩放旋转进行变化，请看图4-4到4-5。

  结论：Blueprint mode：用于控制UI物体的Rect是否进行与UI物体的缩放旋转自动包含适应。

                                                                       图4-1-2

                                                                          图4-1-3

---

当我们开启蓝图模式后：

                                                                           图4-1-4

                                                                           图4-1-5

---

---

2. Raw edit mode作用

Raw edit mode作用：作用于Anchors与Pivot, 开启进行改变Anchors锚点与Pivot的数值时，使UI物体的Position始终不会发生改变。

证明：不开启Raw edit mode时，默认状态（图4-2-1），我们改变Anchors锚点与Pivot的数值时，UI物体的Position值会进行变化（图4-2-2，图4-2-3）
当我们开启Raw edit mode时，改变Anchors锚点与Pivot的数值时，UI物体的Position值不会进行变化。（图4-2-4，图4-2-5）

 提示：图排版比较随意，可以直接拿（图4-2-2与图4-2-4  和图4-2-3与图4-2-5   进行对比观察），就能发现Raw edit mode的作用。

                                                                图4-2-1

---

                                                            图4-2-2

                                                          图4-2-3

---

                                                   图4-2-4

                                                    图4-2-5

结论： Raw edit mode开启时，改变Anchors与Pivot数值都不会改变Pos的值，Ui物体会去适应Anchors与Pivot数值，找到合适的位置使Pos保持原状不改变。

                                ------------我是有底线的--------------
                                感谢能够观看博客的各位Unity开发爱好者们，有问题发表评论呐，*★,°*:.☆(￣▽￣)/$:*.°★* 。