【UGUI學習筆記】RectTransform組件

RectTransform繼承于Transform


?????? 上圖中的中間九個按鈕叫做絕對布局(也有人叫九宮格),邊上的七個按鈕叫做相對布局。上圖只是為了讓用戶更好的操作,下圖才是它的數值:


???????Anchors的名字叫做錨點,其存在最小點與最大點,anchormin與anchormax均為向量。

???????在Anchor下面還有一個屬性叫Pivot,軸心。是坐標原點在UI自身左下角的0-1空間向量。


???????設置紅色框體的Pivot時,其坐標系如圖所示,(0,0)表示紅色物體的左下角,(1,1)表示紅色物體的右上角。


???????下圖中黑色框體為父物體,紅色框體為當前物體。設置紅色框體的anchor時,其坐標系如圖所示,(0,0)表示父物體的左下角,(1,1)表示父物體的右上角。中間的九個絕對布局就是anchormin與anchormax重合。邊上的七個相對布局就是anchormin與anchormax分開。


與父UI的關系:

?????? 當UI處于絕對布局時,軸心點與錨點之間的距離恒定。此時紅色框體的大小不會隨父物體的大小變化而變化,位置會根據Pivot點到Anchor點的距離一致而改變。

???????當UI處于相對布局時,錨點不再是一個點,而是一個框子,通常稱之為錨框,有四個點,anchormin表示左下角,anchormax表示右上角。此時紅色框體的左下角到錨框的左下角距離保持不變,紅色框體的右上角到錨框的右上角距離保持不變。此時紅色框體的四條邊與錨框的邊間距是固定的,紅色框體的大小隨父物體的大小變化而變化。

Pos (X, Y, Z) ,矩形軸心點(pivot)與錨點(anchors)之間的距離。

Left, Top, Right, Bottom,矩形的四條邊與錨框(anchors)之間的間距。

RectTransform的其他屬性:

?anchoredPosition:在絕對布局下,該屬性表示的是錨點到pivot的向量;在相對布局下,unity會根據Pivot、AnchorMin和AnchorMax計算出一個錨點,該屬性表示的是計算出的錨點到Pivot的向量。

offsetmin、offsetmax:offsetmin表示的是當前圖片的左下角相對錨框的左下角的偏移,offsetmax表示的是當前圖片的右上角相對錨框的右上角的偏移。

絕對布局如下圖:


anchor為(0,0.5)
anchor為(0,0)

相對布局如下圖:


anchor為(0,0),(1,0)
anchor為(0,0),(1,1)

sizeDelta:尺寸變化量,該屬性表示offsetMax - offsetMin得到的向量,絕對布局下即從圖片的左下角指向右上角的向量。

sizeDelta可以動態設置Rect大小:絕對布局下sizeDelta(x,y)與Rect的寬高是一致的,可以直接通過sizeDelta的x,y來動態設置RectTransform的對應的寬和高;相對布局下直接調整sizeDelta可以調整Rect大小,但是不好理解,通過offsetMin和offsetMax來動態調整Rect的大小比較方便。

Rect:這是一個只讀屬性,前兩個參數是從Pivot指向UI自身左下角的向量,后兩個參數是UI自身的width和height。在絕對布局和相對布局下輸出一致。

改變RectTransform的top

GetComponent<RectTransform>().offsetMax = new Vector2(GetComponent<RectTransform>().offsetMax.x, top);

改變RectTransform的Right

GetComponent<RectTransform>().offsetMax = new Vector2(right,GetComponent<RectTransform>().offsetMax.y);

改變RectTransform的bottom

GetComponent<RectTransform>().offsetMin = new Vector2(GetComponent<RectTransform>().offsetMin.x, bottom);

改變RectTransform的left

GetComponent<RectTransform>().offsetMin = new Vector2(left,GetComponent().offsetMin.y);

改變RectTransform的width,height

GetComponent<RectTransform>().sizeDelta = new Vector2(width, height);

改變RectTransform的pos

GetComponent<RectTransform>().anchoredPosition3D = new Vector3(posx,posy,posz);

GetComponent<RectTransform>().anchoredPosition = new Vector2(posx,posy);

RectTransform的方法:

void GetLocalCorners(Vector3[] fourCornersArray);?

該方法表示獲取UI的四個角在以自身Pivot為原點的坐標系中的坐標。作為參數的Vector3數組需要自己聲明。獲取四個角的順序是左下、左上、右上、右下。

void GetWorldCorners(Vector3[] fourCornersArray);

該方法表示獲取UI的四個角在世界坐標系的坐標。

void SetSizeWithCurrentAnchors(RectTransform.Axis axis,float size);

按照當前的anchor信息來設置尺寸(實際上根據的是pivot,設置的結果與anchor無關),有兩個參數,第一個是Axis類型的值,需要指定一個方向,水平或垂直;第二個參數,是本身的寬高。

例:將寬高設為(100,30)。

RectTransform rt = GetComponent<RectTransform>();

rt.SetSizeWithCurrentAnchors(RectTransform.Axis.Horizontal,100);

rt.SetSizeWithCurrentAnchors(RectTransform.Axis.Vertical,30);

void SetInsetAndSizeFromParentEdge(RectTransform.Edge edge,float inset,float size);

設置當前UI相對父UI邊的距離及當前UI的尺寸,第一個參數是一個Edge類型的值,需要指定以父對象的哪個邊為基準(也就是Top、Bottom、Left、Right四個值之中的一個,即對齊方式); 第二個參數,是離指定邊的距離; 第三個參數,是本身的寬度或者高度。

例:將寬高設為(100,30),與父UI的右邊間距為0,與底邊間距為0。

RectTransform rt = GetComponent<RectTransform>();

rt.SetInsetAndSizeFromParentEdge(RectTransform.Edge.Right, 0, 100);

rt.SetInsetAndSizeFromParentEdge(RectTransform.Edge.Bottom, 0, 30);

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 230,622評論 6 544
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 99,716評論 3 429
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 178,746評論 0 383
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 63,991評論 1 318
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 72,706評論 6 413
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 56,036評論 1 329
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 44,029評論 3 450
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 43,203評論 0 290
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 49,725評論 1 336
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 41,451評論 3 361
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 43,677評論 1 374
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 39,161評論 5 365
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,857評論 3 351
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 35,266評論 0 28
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 36,606評論 1 295
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 52,407評論 3 400
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 48,643評論 2 380

推薦閱讀更多精彩內容