一、用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保持縮放比。