Rect Transform
我們都知道,Unity3D中所有的GameObject都必須要攜帶一個Transform組件,且該組件無法移除,那么作為UI顯示的GameObject則不是攜帶Transform而是使用Unity3D專門為UI組件設計的Rect Transform組件,如下:
另外說一下,Canvas Renderer也是UI組件必須攜帶的組件。
我們來看一下其為我們提供的功能:
位置
位置是以像素為單位,其具體的值則以錨點為准,表示和錨點距離,其中x軸從左到右的數值越來越大,y軸從下到上的數值越來越大,其中的Pos Z和Transform中的position.z效果一致,但不是使用該值來表示UI的深度。保留該值估計是為了在3D UI的一些效果實現上的考慮。
尺寸
不同於縮放,這兩個值設置了UI的尺寸,為負並不會翻轉UI而是直接不顯示。
上面的兩個按鈕,上方的按鈕是設置width為320,下方則是將width為160的按鈕的scale x設置為2。
旋轉
效果同Transform,一般配合Tween使用。
縮放
效果同Transform,一般配合Tween使用。
深度
不通過NGUI的深度,在UGUI中的深度完全使用樹形結構來表示,同一層級里位於下方的節點會覆蓋掉位於上方的節點,如下:
修改一下樹形顯示列表后如下:
Anchor
Rect Transform除了上面提到的功能外,還提供了描點功能,該功能主要實現相對布局的功能。
同時我們還可以非常直觀的配置描點:
錨點描述的是當前UI的父對象的位置信息。而錨點則表示當前對象坐標的(0, 0)點。
非stretch
我們可以發現有Left、Center、Right、Top、Middle及Bottom六個設置項,這6個項目可以組合出9種形式的錨點,分別對應了當前UI父對象的9個方向的位置,這樣方便我們的UI做相對位置的調整,比如當UI的坐標為(0, 0),選擇CenterMiddle則當前UI為居中狀態,而選擇TopLeft則UI會位於父對象的左上角。
CenterMiddle:
TopLeft:
stretch
除了上面說到的還有一種stretch狀態,該狀態則表示當前UI距離父級UI邊緣的距離,當設定了之后則是使用一種類似相對位置的方式來定義UI的位置及尺寸,我們看下:
當我們選擇水平和垂直都為stretch時,Pos X、Pos Y、Width和Height都改變為Left、Top、Right及Bottom,即使用了相對位置來排列,我們調整一下看看。
我們發現按鈕始終和父級保持10個像素的距離,調整父級的尺寸會修改子級的尺寸,如下:
我們發現按鈕始終為一種相對的位置呈現。
自定義Anchor
我們之前定義錨點都是直接在下拉菜單中選擇,那么錨點是否可以自定義,答案是肯定的,比如當我們需要下面的效果時就需要自定義Anchor了。
我們希望子UI的尺寸始終和父UI的尺寸保持一定的比例,比如無論父UI多大,子UI都占其10%的空間。
我們只需要將子UI的錨點設置為一個合適的值即可,比如設置為子UI的尺寸,如下:
我們復制幾個改變大小看看效果:
Pivot
注冊點或者叫做中心點,如果說Anchor表示的是UI的父級的位置,那么Pivot則表示UI本身的(0, 0)點的位置。
我們首先開啟Pivot:
然后就可以在場景中修改UI的Pivot了,如下:
這個小藍圈就是Button組件的中心點,表示Button組件的(0, 0)點。
下面我們看一個實例:
我希望在屏幕的右上方顯示一個按鈕且按鈕和屏幕的間距為10,只需要將按鈕的中心點也設置到右上方即可,如下:
補充
藍圖模式
表示是否忽略掉物體的旋轉。點開不能對物體進行旋轉。
RawEdit模式
表示當修改Anchor時UI的位置及尺寸是否會根據Anchor進行匹配,點開可以進行匹配。