Unity開發 深入理解RectTransform

2021-08-20 11:12:54 字數 2940 閱讀 1921

工作以後自己的時間被狠狠的壓縮,回家以後有時候也不太想思考技術性問題,思考了也不一定寫總結,所以呢,部落格更新起來比較慢,不過最近鑽研了很多問題,準備好好總結一下,陸續會把相關的內容發出來分享。。。言歸正傳,這篇主要說說recttransform這個在處理ui位置,形變繞不過的元件。

新手在製作ui介面的時候經常會有這樣疑惑?

為什麼ui設定了相對位置以後ins面板上的引數一直變化? 四個虛線標記有什麼用? 藍色的點又是什麼? 錨點的作用是什麼? 軸點的作用是什麼?

怎麼用**控制ui的位置呢? position是什麼位置 localposition又是什麼位置? rotation的作用是什麼?

scale有什麼用呢?

好了,帶著上面的問題,我將借助「快樂風男」的ui詳細的介紹recttransform元件各個引數的意義,並在例項中測試,海陸空全方位更立體更豐滿的理解recttransform。本文從下面幾個部分展開。

第一欄處理當前物件與父親的相對關係,unity提供了基本上平面上的各個方向供大家選擇,第一欄右邊的資訊,如當前圖中的left等,是在說明當前ui邊界與錨點的位置關係。

第二欄anchors是錨點,用來約束當前物件的邊界資訊,min,max表示了按照比例,錨點在父物件中的位置。

第三欄,軸點pivot,用來描述當前物件在處理位置資訊時真正的中心,以這個點的座標做計算。

第四欄,rotation, 控制當前物件的旋轉

第五欄 ,scale, 根據已經設定好的引數,進行等比例縮放

position:當前物件的軸座標在ui介面中的位置

localposition:當前物件的軸座標相對父親軸座標的位置

scale:當前物件的縮放比例

localscale:當前物件在父物件縮放的基礎上再進行縮放的比例

rotation:繞x,y,z座標軸旋轉的角度

localrotation:在父物件旋轉的基礎上再進行旋轉

這個小雪花就是錨點,有時候會聚在一起,有時候又會分離

仔細**這個相對位置圖就會發現,每乙個上面的小點就是錨點集中在一起的位置,當我們選擇stretch時,錨點就會分散開。

這個屬性框裡一會兒posx,top,一會兒left,right是怎麼回事呢?

首先需要明確乙個問題,這些都是用來描述當前ui邊界與錨點的相對位置關係的,只不過根據選擇的模式不同,這些會做相應的變化,這些對應的描述的變化都是描述當前位置關係最合適的引數。

anchor聚集

anchor分散

當錨點聚集在一起時,位置引數由軸點和anchor確定,當錨點分散時,有ui邊界和anchor確定。

如上圖 anchor聚集,我設定posx為100,ui快樂風男右移100,圖中標記的距離是軸點藍色圓圈與錨點小雪花的距離。

如上圖 anchor分散,設定left,標記的距離是ui左側邊界與右邊anchor的距離。

軸點就是ui中心的藍色的圓圈,當我把軸點設定為0.5,0.5時,軸點就會處在ui的中心,pivot的範圍為(0-1,0-1),與ui的長寬成比例。

當我們處理position,localpositon,rotation時,都是根據pivot進行計算的。

如上圖,左側為當前ui風男的位置資訊,右側為父物件的資訊,可以看到,position和localposition的資訊是不一樣的,父物件的軸點也在中心,可以看到軸點在承擔了計算的基準。

這個引數控制ui的旋轉,但是需要注意的是,這個引數是由四元數控制的,上面的xyz值是經過轉換顯示出來的尤拉角

有倆個旋轉引數,rotation表示按照canvas的座標記進行旋轉,localrotation是在父物件旋轉的基礎上在進行旋轉,所以,b在a中,a旋轉30度,b進行設定rotation是不會變的,但是設定localroation會再進行旋轉30度。

旋轉的基準是軸座標。

軸座標在中心,旋轉180

軸座標在左下角,旋轉180

將ui在x,y,z方向上進行縮放

歡迎關注知乎unity專欄:

深入理解IOC模式及Unity框架

研究了下,有幾篇部落格確實已經說得很清楚了 1 ioc模式 2 深入理解dip ioc di以及ioc容器 這個算是最通俗易懂的,手動實現了ioc容器 由淺入深 3 理解依賴注入 ioc 和學習unity 這個也不錯,特別最後介紹的挺詳細 4 你真的了解ioc與aop嗎?這個系列文章 雖然有點難,但...

深入理解IOC模式及Unity框架

學習ioc發現如下部落格寫的很清楚了,故mark下來以便以後查閱和溫習!1 ioc模式 2 深入理解dip ioc di以及ioc容器 這個算是最通俗易懂的,手動實現了ioc容器 由淺入深 3 理解依賴注入 ioc 和學習unity 這個也不錯,特別最後介紹的挺詳細 4 你真的了解ioc與aop嗎?...

深入理解IOC模式及Unity框架

研究了下,有幾篇部落格確實已經說得很清楚了 1 ioc模式 2 深入理解dip ioc di以及ioc容器 這個算是最通俗易懂的,手動實現了ioc容器 由淺入深 3 理解依賴注入 ioc 和學習unity 這個也不錯,特別最後介紹的挺詳細 4 你真的了解ioc與aop嗎?這個系列文章 雖然有點難,但...