天天看點

UGUI系列——Unity Auto Layout的使用(一)基礎知識點Unity Layout元件

UGUI系列其他博文,可通過導航帖檢視

基礎知識點

先說一下UI的 Pivot,這個是UI的軸心點,UI上錨點的AnchoredPosition是以它為基準的,左下角是Pivot的(0,0)點,左上角是(0,1)點,以此類推。

你如果想修改一個UI的高度或寬度,但是又不想改變它的位置,那麼 修改軸心點 就是你想要的。

UGUI系列——Unity Auto Layout的使用(一)基礎知識點Unity Layout元件

如圖,這樣設定後,修改width時,因為它的基準點時在x軸的中心,是以你增加的寬度會平均配置設定到兩側,中心的不變,但是,你設定高度時,y軸就會出現,無論height怎麼改變,它的上邊的位置永遠是不變的,增加的高度都會延長下邊。

Unity Layout元件

下面,進入正題

unity的Layout元件分成三種:

1)水準布局:Horizontal Layout Group

UGUI系列——Unity Auto Layout的使用(一)基礎知識點Unity Layout元件

Padding:是調整内邊距的參數,也就是你想讓被自動布局部分離邊有多少像素,就設定成多少,很簡單,不多說。

Spacing:每個子物體之間間隔多少像素

Child Alignment:對齊方式

Child Controls Size:布局元件是否控制子物體的Width/Heigh

Child Force Expand:是否自适應Width/Heigh

2)垂直布局:Vertical Layout Group

UGUI系列——Unity Auto Layout的使用(一)基礎知識點Unity Layout元件

參數同Horizontal Layout Group完全一樣

3)網格布局:Grid Layout Group

UGUI系列——Unity Auto Layout的使用(一)基礎知識點Unity Layout元件

Padding:是調整内邊距的參數

Cell Size:用來設定子物體的大小

Spacing:每個子物體之間x軸/y軸上的間隔像素

Start Corner:第一個子物體所在角落

例如:

選擇Upper Left,子物體順序如下

UGUI系列——Unity Auto Layout的使用(一)基礎知識點Unity Layout元件

選擇Lower Left,子物體順序如下

UGUI系列——Unity Auto Layout的使用(一)基礎知識點Unity Layout元件

Start Axis:子物體排列的軸向,也就是縱向排列還是橫向排列的選擇

Child Alignment:對齊方式

Constraint:把子物體限制成固定的行或者列

flexible:自由排列,也就是根據選擇的軸向,自動排列,剩餘空間不夠便自動換行/換列

fixed column count:限制列數

fixed row count:限制行數

我會在我的公衆号上推送新的博文,也可以幫大家解答問題

微信公衆号 Andy and Unity 搜尋名稱或掃描二維碼

UGUI系列——Unity Auto Layout的使用(一)基礎知識點Unity Layout元件

希望我們能共同成長,共同進步