Unity3d：NGUI 固定錨點及自適應分辨率

要實現相似NGUI官方例子1的2D UI界面時，假如相似下圖

 

左上地圖、左下移動、右下開火、底部血條、右上和右邊按鈕。

若想要固定位置，且能自適應分辨率。

首先，建UI ROOT2D，默認移動到panel下，再在panel下新建空物體offset用於調整位置，再在offset下建UI貼圖sprite、label、button之類。

結構以下：

UI ROOT(2D)

----Camera

　　----Panel

　　　　----Anchor-BottomLeft    設置side屬性爲BottomLeft

　　　　　　----offset-move　　調整位置使其顯示正確

　　　　　　　　----sprite

　　　　----Anchor-BottomRight

　　　　　　----offset-fire

　　　　　　　　----sprite

 

同理再建其餘Anchor-TopLeft，Anchor-TopRight、Anchor-Right之類的。

 

這個時候已經能夠實現固定錨點了。可是還有自適應分辨率。

在panel上附加UIStretch 腳本，此腳本用於自適應縮放。

 

有以下幾種方式：

Horizontal：只縮放水平方向

Vertical：只縮放垂直方向

Both：縮放兩個方向

BasedOnHeight：基於高度等比縮放

 

假如你的UI是在800*480的正常尺寸。那麼有兩種方法。

1、把Camera設置size爲800。選Both方式。

2、Camera的size仍爲1，設置UIStretch 腳本的Relative Size 爲，x：1/800，y：1/480。

推薦第二種。

設置完會發現雖然能夠縮放，但對於圓形會變拉伸成橢圓。

 

爲解決這個問題，咱們再加一種方式：（參考別人的，不知道出處了。。。）

BasedOnWidth：基於寬度等比縮放

 

修改UIStretch腳本

Enum Style加上

BasedOnWidth

 

Update函數里加上

else if(style == Style.BasedOnWidth) 
{
　　localScale.x = relativeSize.x * rectWidth;
　　localScale.y = relativeSize.y * rectWidth;
　　localScale.z = localScale.x;
}

 

而後選擇BasedOnWidth模式。把Relative Size 的x和y都設置爲：1/800。