關於Unity中的NGUI和UGUI


一、用Unity開發2D游戲,有三套關系

1.GUI:Unity本身自帶的GUI

2.NGUI:以前在Unity中廣泛來做2D的,是第三方的包,需要安裝

3.UGUI:Unity5.X后(其實是Unity4.6以后),Unity找到NGUI的作者,用了一年開發了UGUI,變成內置於Unity中的包,官方主推,

     所有的GUI元素都在Unity的UI工具欄,右鍵--->UI,后來這個作者因為自己個人的原因離開了Unity

 

二、3D游戲是以米為單位,2D游戲是以像素為單位。所以用Unity做2D要解決這個問題。有兩種解決方案:

3D做2D游戲的方法:

1: 使用正交攝像機:多大就是多大,沒有什么變換。

2: 使用透視攝像機,將2D元素移動到合適的距離(Z的位置)。例如設計分辨率為 960x640, 使得在3D世界里面一個圖片的大小w*h米,將這個圖片移動到一定的距離(Z的位置),在Game視圖里面能全屏地顯示這個2D精靈。

計算方法:tag(視角*0.5) = (h/2) / zeye攝像機到精靈的距離; zeye攝像機到精靈的距離= h / (2 * tan(30));

     960*640的zeye值大約是554,也就是要把Image的Z軸設置成5.54,這樣才能把Image剛好覆蓋整個Game視圖屏幕

 

 

三、3D做2D游戲的步驟:

1.創建一個2D精靈

2.把圖片的Texture Type改為Sprite

3.這時候圖片屬性會出現一個Pixeis Per Unit表示多少像素為一米 ,Pixeis Per Unit 100:100個像素為1米。960*640大小是9.6*6.4米

4.把圖片拖進精靈的Sprite屬性中

5.旋轉圖片90度(直接修改Inspector的Z軸參數)

6.設置精靈的Z軸的位置,使得在Game視圖里面能全屏地顯示這個2D精靈。這個Z軸的數值可以通過計算得出,zeye攝像機到精靈的距離= h / (2 * tan(30));,每個比例像素的Z軸大小都是不同的,其中960*640應該設置為5.54。這一步驟是為了獲得這個比例。

7.如果不想改變精靈的Z軸位置,但是又想讓它在Game視圖里面能全屏地顯示,這時候可以修改精靈的X和Y的Scale縮放比例,如果原本Z的大小為10,則X和Y應該縮放5.54,即10/5.54的比例,也就是原來的長度和寬度乘10/5.54得到現在的長寬。這個長寬比原來的大,剛好可以讓它在Game視圖里面能全屏地顯示。這個比第六步更加靈活,更加實用,是3D做2D游戲的解決方案。

 

 

 

四、UGUI

底下有

1.一個Canvas管理所有的子2D的UI節點,等到要縮放的時候,只要縮放Canvas就可以縮放所以2D的UI節點。2D元素適配到3D世界。

 創建的時候會自動創建一個EventSystem節點,用來專門接受管理事件。如果直接創建一個Text,系統也會自動幫我們創建一個父Canvas節點和EventSystem節點。

2.控件(Button,Label)

3.事件響應

 

 

 

五、Canvas節點

有四個組件,這里講前三個

1.Rect Transform組件:不能改變,一創建就不能修改的組件,而且繼承自Transform組件

2.Canvas組件(繪制2D元素的原理):

Render Mode:

  (1)Screen Space (overlay):自適應屏幕空間,覆蓋到屏幕上面,像電視機的菜單一樣,總是在最上面,可能是使用正交攝像機實現的,因為不開源,所以猜想。

               在Canvas節點下的Image精靈節點直接點擊Set Native Size就會讓Image節點自適應在屏幕上,在Game視圖里面能全屏地顯示。    

   Pixel Perfect:勾選的時候,顯示的效果更好,subPixel技術。

   Target Dispaly:繪制到哪個屏幕上,可以有多個顯示器,選擇一個顯示器繪制。

 

  (2)Screen Space (Camera):在沒有設置Render Camera屬性的時候,和第Screen Space (overlay)一樣,會有黃色警告。

    Plane Distance:2D和3D的遮擋關系,可以把3D物體放在2D的Canvas之前,也可以放在2D的Canvas之后,和3D物體的Z軸Position比較大小,但是至始至終Canvas在Game視圖里面能全屏地顯示。  

        

   (3)World Space:把它當成World空間來做,這時候Rect Transform組件可以改變。我們Canvas下面的的精靈子節點,只需要把它的Z軸的坐標改成0,就可以被換算成對應的能全屏顯示在Game視圖的坐標。

           等於用手動設置Scale,等於之前3D做2D游戲的手動方法。Canvas Scaler組件在這種模式下沒有作用,所以記得要把image的長寬改成9.6和6.4。使得2D和3D節點很好地融合在一起。

                

        

3.Canvas Scaler組件:把3維世界的物體正確地換算到2維世界中,就像上面的縮放X,Y,Z軸10米,則scale的x為10/5.54,y為10/5.54

UI Scale Mode:

    (1)Constant Pixel Size:圖片有多大,就把它顯示到多大的窗口里面。不會對進行任何的縮放,所以如果是960*640的圖片精靈,只能在960*640的分辨率窗口下顯示完全,其他的不行。

    (2)Scale With Screen Size:按照屏幕來進行縮放,960*640設計分辨率也可以在800*480屏幕分辨率全屏顯示,這個模式比較常用。為了2D元素縮放不走樣,寬度和高度都要縮放同樣的比例,所以只要一個調節線就可以。

   Match:不同的分辨率轉換的時候的X,Y的轉換因子大小,比如960*640轉800*480,X,Y的比例縮放因子設置,寬度800/960=0.83,高度480/640=0.75,所以那個拉條就是在0.75到0.85之間的數值變化。

         但是我們一般要么固定寬度,要么固定高度,條拉到底。分辨率成倍數的是可以完美轉換的,不成的話就會有一些部分長或者寬沒顯示出來(很少)。

  (3)Constant Physical Size:(1)是按照像素來顯示的960*640,這里是按照物理尺寸4:3來顯示的

  

注意:Imgae組件是無交互式的組件,里面的Source Sprite屬性必須是Spite類型的精靈,Texture類型的不行。Image組件還可以設置顏色,也可以掛材質球(但是不適用於Screen Space (overlay)),設置貼圖屬性,preserve aspact保持縮放比。

 


免責聲明!

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



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