關於Unity中的屏幕適配


一、Game視圖的屏幕分辨率可以先自定義添加,供以后選擇,以下是手游經常用到的分辨率:

1.1136X640,iPhone5

2.1920X1080,橫屏,主流游戲都是這個分辨率

3.1080X1920,豎屏

4.960X640,橫屏iPhone4

5.640X960,豎屏iPhone

6.768X1024,ipad

7.800X480

8.480X800

 

Screen Space(Overlay)模式下的Canvas節點的Rect Transform組件的Width和Height是隨着Game視圖的分辨率的選擇而改變的,是不能手寫修改的,但是其子節點的Rect Transform組件是可以改變的。 

 

 

二、Image節點的Rect Transform組件是可以修改的,其中:

1.PosX,PosY,PosZ(0)表示Image節點在父節點下的相對坐標,以父節點的菊花為參照原點(0,0),可以修改菊花的位置,這時候PosX,PosY也就自動改變了。

2.ScaleX,ScaleY,ScaleZ表示Image節點的縮放,可以讓節點隨着自己設置的值拉伸收縮

3.Pivot:中心點,支點。定義圖片的中心點在哪里,就是相當於Cocos2d里面的精靈的錨點,這個點是受PosX,Pos影響的,也就是說,這個點到父節點原點的距離就是PosX,PosY。Pivot(0,0)在左下角,Pivot(1,1)在右上角,Pivot(0.5,0.5)在中心

4.Rotation旋轉,可以選擇Scene視圖的2D按鈕來讓視圖更好調整。

5.那朵菊花,也就是父節點的原點,可以在父節點的范圍內隨意移動的,這個只能在子節點的Inspector面板里面設置因為父節點Canvas是不能更改Rect transform組件的。

 菊花不能超過父節點的范圍,它是相對於父親的百分比來算的,這樣改變父節點的大小,菊花還是在哪個位置。

 其中Anchors屬性(相對父親的停靠點),是和左上角的圖案配套來設置父節點的菊花位置的。Anchors min max 表示四小朵菊花瓣的位置,四小朵菊花瓣組成了大菊花。目前只知道4朵花瓣和在一起可以表示父節點的原點,分開的四朵花瓣的作用還沒有搞清楚。

 除了那9個代表性的菊花的位置外,還可以自己設置菊花的位置,可以占用某一列下來的百分比,或者某一行的百分比,通過用鼠標拖拽在Scene視圖里面移動可以看到視圖中有百分比數值在變化,只要看到自己想要的停下了就行了。

 

三、菊花的作用:

一個父節點下面有很多的子節點,每個子節點都有自己相對於父節點的菊花,也就是說Image子節點的菊花可以在左上角,然后它把自己的Pivot設置成(0,1),這樣,再把自己的PosX,PosY,設置成(0,0),就可以把Image節點附着到父節點的左上角了。

其他的子節點可以根據自己想附着的位置而設置自己的菊花位置。

 

 四、屏幕適配准備工作:

創建一個Canvas節點

設置Canvas節點的Canvas組件的Render Mode為Screen Space(Overlay)

創建一個Image類型的UI節點在Canvas父節點下面

設置圖片的Texture Type為Sprite

把圖片拖進Image節點的Source Image屬性下面

點擊Image節點的Set Native Size

設置Canvas節點的Canvas Scaler組件的UI Scale Mode為Scale With Screen Size

設置Canvas節點的Canvas Scaler組件的Reference Resolution為640X960,這個是美術的設計分辨率

設置Image的ScaleX,ScaleY,數值為640/512,640是640X960的寬,512是圖片的寬度,讓背景圖片盡可能地覆蓋Canvas,超出一點也沒關系。

 

做背景圖的時候要長一點,這樣就可以適配所以分辨率的要求,不然如果是按照寬度適配的話,上下會不斷改變,而按照高度適配的話,左右會不斷改變,我們一般選擇用寬度適配,

也就是設置Canvas節點的Canvas Scaler組件的UI Scale Mode為Scale With Screen Size,設置Canvas節點的Canvas Scaler組件的Match拉條,拉到Width,所以美術要做高背景圖。

 

 五、屏幕適配開始解決方案:

一個Canvas下面有很多的子節點,每個子節點的寬高設置為0,然后每個子節點自己的子節點的菊花就不能移動,然后改變Canvas子節點的菊花位置到中上位置,這樣子節點的子節點就會被固定在Canvas中上的位置,不管怎么改變Game視圖的分辨率,Canvas怎么變化,子節點的子節點還是在中上的位置,這就是屏幕適配。

 

 

面試會問UGUI的屏幕適配策略

 


免責聲明!

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



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