Unity中Rect類型詳解


Rect類的用處以及為什么要了解它?

簡單來說,這個主要在Unity的UGUI、GUI以及編輯器擴展GUILayout等時設置布局都要用到,了解一下豐富自己的知識面,減少寫出bug的情況。

Rect類型的基本概念

眾所周知這是一個矩形的結構體類型,那么它內部是如何來定義的呢?先來看一下官方怎么說
在這里插入圖片描述
這么一大坨的主要意思就是:知道一個矩形的根坐標(x,y)和長寬(width,height)就可以定義一個矩形了。Unity用了很多2d空間,一般都使用左下角為根坐標(例如屏幕坐標)從x向右遞增,y向上遞增。這個Rect使用的恰恰相反,x向右遞減,y向上遞減(這句別看,建議直接跳過)。很多人可能還是不能理解,一臉懵逼。沒錯官網這個說明有點抽象,甚至會誤導。接下來我給大家用自己的方式講解。

徹底理解它,開始!

rect.x與rect.y (這一節很重要,懂了這個其他的就都很簡單了!)
x,y就是rect類的根坐標,有了它我們就能確定我們就能確定矩形的位置。我們寫個小代碼來確定一下它的根坐標到底在哪?

	void Update()
	{
        if (Input.GetMouseButtonDown(0))
        {
            Rect r=new Rect(0,0,200,200);
            print(r.Contains(Input.mousePosition));
        }
    }

這時候我們點擊我們屏幕的左下角,發現返回true,完全可以點擊到。

對!其實就是這么簡單,不要被官網的說明誤導。它就是根坐標在左下角,根據width與height向右和向上畫出來的一個矩形,但是還稍稍有點不太一樣。
在UGUI中,transform.rect你得到的相關屬性或許很會奇怪。接下來的例子我們都以transform.rect得到的值來講解。

我們在界面中添加一個Image,他的錨點與pivot值都不變,具體如下圖:
在這里插入圖片描述
這時候他的長寬都是知道的。我們輸出trans.rect.x與trans.rect.y會是什么呢?
結果是(-50,-50),rect.size就是對x與y的包裝。
因為rect的根是基於pivot的值來算的,把pivot的位置作為整個圖形坐標的原點(0,0)。那么trans.rect的x與y因而所以就在第三象限為負值。
那么trans.rect.x與y的算法就是x=-widthpivot.x 和 y=-heightpivot.y。

下面用一張圖來幫助理解。
在這里插入圖片描述
驗證代碼

    print("trans's rect x and y"+trans.rect.x+" "+trans.rect.y);
    print("caculate rect x and y"+-trans.rect.width*trans.pivot.x+" "+-trans.rect.height*trans.pivot.y);
    //trans.rect.position就是 x和y的封裝

結果輸出
在這里插入圖片描述
舉一反三
那么如果pivot改為(0.5,1),trans.rect的xy各是多少呢?還是一樣的公式,此時整個坐標的原點到了圖形最上面那一條邊的中間了,trans.rect的xy為(-50,-100)。

總結:UGUI中rect的根坐標是基於pivot的位置來計算的。其他場景下的rect可以認為pivot為(0,0),那么rect的根坐標也就自然為(0,0)。

rect.min和rect.max
rect.min也就是(rect.x,rect.y),表示左下角坐標也就是根坐標
rect.max就是(width+rect.x,height+rect.y),表示右上角坐標
同時rect.min=(rect.xMin,rect.yMin) rect.max(rect.xMax,rect.yMax)
(以下例子pivot為(0.5,0.5))
代碼驗證

    print("trans's rect min and max"+trans.rect.min+" "+trans.rect.max);
    print("caculate rect min and max"+new Vector2(trans.rect.x,trans.rect.y)+" "+new Vector2(trans.rect.width+trans.rect.x,trans.rect.height+trans.rect.y));     

結果輸出
在這里插入圖片描述
舉一反三
如果這是pivot為(0,1)呢?
通過上面的公式求的min(0,-100)max(100,0)

rect.center
rect.center就是整個矩形的中心坐標。
center.x坐標為(rect.xMin+rect.xMax)/2
center.y坐標為(rect.yMin+rect.yMax)/2
(以下例子pivot為(0.5,0.5))
代碼驗證

    print("trans's rect center"+trans.rect.center);
    print("caculate rect center"+(trans.rect.xMin+trans.rect.xMax)/2+" "+(trans.rect.yMin+trans.rect.yMax)/2); 

結果輸出
在這里插入圖片描述
舉一反三
如果這是pivot為(1,1)
center值為(-50,-50)

多實踐幾次就可以徹底理解了。上文主要討論了UGUI中的rect的各個屬性的求法,其他情況下求法一樣。只把pivot考慮為(0,0)就可以了


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM