UGUI 有它的實用性, 可是也存在理解上的困難, 因為它在面板上的顯示內容根據布局而變動, 如果不深入理解它的設計原理, 估計每次要進行程式上的修改都需要進行一次換算和測驗程序.
1. 設定某UI的尺寸.
它并沒有提供一個直接設定尺寸的API, 因為想要改變UI大小根據需求有不同的方法, 不同的方法會造成不同的結果. 比如可以修改 anchorMin / anchorMax , 或是修改 offsetMax / offsetMin, 又或是修改 sizeDelta, 有多種可能的方案, 可是某些修改是會對子節點的UI造成很大影響的, 我們需要找到一個比較穩定的修改方法. Anchors相關的變數會造成子節點變化, 不應該修改它, 而offsetMax / offsetMin 跟 sizeDelta 其實可以看成是相同的表達, 只不過表現形式不一樣. 那么簡化的函式就是 :
public static void SetSize(RectTransform rect, Vector2 targetSize) { var originSize = rect.rect.size - rect.sizeDelta; var makeSizeDelta = targetSize - originSize; rect.sizeDelta = makeSizeDelta; }
只需要幾次減法即可設定非常方便, 它的邏輯就是依據sizeDelta的性質來計算的 : sizeDelta 代表的是Rect現在的大小與原始Rect的大小的差, 公式應該是:
RectSize(原始大小) + sizeDelta = RectSize(當前大小)
那么我們要設定一個目標大小, 只需要先計算出原始大小, 然后用 RectSize(目標大小) - RectSize(原始大小) = sizeDelta 即可得出要得到目標大小時的sizeDelta, 直接設定給rect的sizeDelta 即可, 這樣計算又簡單, 又不需要改動錨點等, 保證修改程序的穩定性... 順帶一提 sizeDelta 絕對不是UI的大小, 是UI現在的大小跟UI的原始大小的差, 只有在錨點 anchorMin , anchorMax 相等時, UI 的原始大小為0, sizeDelta才跟UI大小相等.
2. 用UI的某個 Pivot 去跟父節點UI的某個 Pivot去對齊
看起來很亂來的需求, 看圖理解:
子UI紅色的 Pivot為 (0, 1), 而我們要把它的 (0.5, 1.0) 與父UI 的(0, 1) 的位置對齊, 也就是紅色UI的中間頂部跟白色UI的左上角對齊, 修改方式也有很多種, 通過修改 anchoredPosition 應該是最穩健的方法了, 因為它不會修改任何造成子節點UI變化的變數. 簡化的計算方法如下:
public static Vector2 SyncPovitToParent(RectTransform rect, Vector2 pivot, Vector2 parentPivot) { var parent = rect.parent as RectTransform; var offsetInParent = MathTools.Multiple(MathTools.Multiple(rect.pivot, rect.rect.size) - MathTools.Multiple(pivot, rect.rect.size), rect.localScale); var parentOffset = MathTools.Multiple(parentPivot, parent.rect.size) - MathTools.Multiple(rect.pivot, parent.rect.size); return MathTools.VectorAdd(parentOffset, offsetInParent); }
MathTools 只是做了Vector對應變數的乘法加法等功能.
這個方法的好處在于你不需要修改 Pivot 變數, 只通過移動UI的方式來進行對齊, 沒有用到距離, 除法等...
rect.anchoredPosition = SyncPovitToParent(rect, new Vector2(0.5f, 1), new Vector2(0, 1));
rect 就是要對齊的紅色UI, new Vector2(0.5f, 1) 是選定紅色UI的Pivot位置( rect的原始Pivot為(0, 1), 計算前后不變 ), new Vector2(0, 1) 是選定父節點UI的Pivot位置, 計算后rect相應的位置與父節點相應位置重合. 邏輯如下 :
1. 計算在當前Pivot下怎樣移動rect才能使當前 Pivot 與父節點相應 Pivot 點重合
var parentOffset = MathTools.Multiple(parentPivot, parent.rect.size) - MathTools.Multiple(rect.pivot, parent.rect.size);
直接用 parent.rect.size 作為坐標系, 乘上 parentPivot, rect.pivot 作為向量, 相減得出 rect 要移動的向量 parentOffset.
2. 計算在當前Pivot下, 怎樣移動rect 才能讓當前Pivot 與選定紅色UI的 Pivot 位置重合
var offsetInParent = MathTools.Multiple(MathTools.Multiple(rect.pivot, rect.rect.size) - MathTools.Multiple(pivot, rect.rect.size), rect.localScale);
使用當前UI大小作為坐標系, 乘上 rect.pivot, pivot 作為向量, 相減得到 rect 坐標系中的偏移量, 然后再乘以當前坐標的縮放 rect.localScale 就得到在父UI中 rect 要移動的向量 offsetInParent.
兩個向量相加得到最后要偏移的量 anchoredPosition ...
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/14626.html
標籤：其他