Unity3D UGUI與2D游戲(項目)UI框架

1、搭建UI界面

1.1準備工作

1、調整Game視圖中的分辨率800*480

2、在 Edit --Project? Setting--Editor中,將Mode改為2D模式

3、調整攝像機為正交攝像機,調整攝像機的Clear Flags 為 Soild Color ,選擇自己喜歡的顏色,調整Size 為 800/480

4、創建一個Canvas

4.1、在Canvas組件里,將Render Mode 改為 Screen Space - Camera,Render Camera中拖入Main Camera

4.2、在Canvas Scaler 組件中,UIScaleMode 改為 Scaler With Screen Size,把Refernce ?Ressolution 改為 與分變率一致800*480,因為是橫屏的Match選擇 Weight=1

1.2、搭建界面(展示一下效果圖)

開始界面:

選項界面:


2、UIManager:UI界面的切換

2.1、 首先創建兩個腳本 UIBase,UIManager,一個空的游戲對象Manager,UIManager掛載到Manager

UIbase:

public class UIBase : MonoBehaviour {

? ? ? ? public virtual void UserInterfaceEnter(){}

? ? ? ?public virtual void UserInterfacePause(){}

? ? ? ?public virtual void UserInterfaceResume(){}

? ? ? ?public virtual void UserInterfaceExit(){}

}

UImaneger:

第一步創建腳本的單例:

static UIManager instance;

public static UIManager Instance{

get{return instance;}

}

void Awake(){

instance = this;

// ?下面兩行代碼是加載UI界面

LoadUIPerfabByName ("UIstart");

LoadUIPerfabByName ("UIoption");

}

第二步:UI界面的顯示就好比棧的形式,使用棧來控制

Stack<UIBase> ?UIStack =new Stack<UIBase>();

// 界面入棧:讓界面顯示出來

public void PushUserInterface(string UIName){

if (UIStack.Count>0) {

UIBase old_UI = UIStack.Peek ();

old_UI.UserInterfacePause ();

}

UIBase newUI = InstantiateUIByName (UIName); ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?//InstantiateUIByName方法:創建UI界面

UIStack.Push (newUI);

newUI.UserInterfaceEnter (); ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? // 通過UserInterfaceEnter這個方法顯示界面

}

// 界面出棧:讓界面不顯示出來

public void PopUserInterface(){

if (UIStack.Count == 0)

{return;}

UIBase old_UI = UIStack.Pop ();

old_UI.UserInterfaceExit ();

if (UIStack.Count>0) {

UIBase newUI = UIStack.Peek();

newUI.UserInterfaceResume ();

? ? ? ? ? }

}

// ? InstantiateUIByName方法:創建UI界面

Dictionary<string,UIBase> currentUIDict =new Dictionary<string,UIBase>(); ? ? // ? 存儲到當前為止,所有已出現過的UI界面的字典

public UIBase InstantiateUIByName(string UIName){?

if (currentUIDict.ContainsKey(UIName)) {

return currentUIDict [UIName];

}

GameObject objPrefab = UIobject[UIName] ; ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? // ? UIobject:一個存儲所有已加載界面的字典

GameObject obj = GameObject.Instantiate (objPrefab);

UIBase uibase = obj.GetComponent();

currentUIDict.Add (UIName, uibase);

obj.name = UIName;

return uibase;

}

//? 創建UIobject:一個存儲所有已加載界面的字典

public ? string perfabDir ="Perfab";

Dictionary<string,GameObject>UIobject =new Dictionary<string,GameObject>();

void LoadUIPerfabByName(string UIName){

if (UIobject.ContainsKey(UIName))

?{return;}

string path =perfabDir+"/"+UIName;

GameObject UIobj = Resources.Load(path);

if (UIobj!=null) {

UIobject.Add (UIName, UIobj);}

}

2.2、創建UIOption、UIStart腳本,分別掛載到Option和Start UI界面

UIStart:

public override void UserInterfaceEnter (){

GetComponent().worldCamera = Camera.main;

gameObject.SetActive (true);}

public override void UserInterfacePause ()

{gameObject.SetActive (false);}

public override void UserInterfaceResume ()

{gameObject.SetActive (true);}

public override void UserInterfaceExit ()

{gameObject.SetActive (false);}

//UIStart界面 ? ? 選項Button添加監聽事件

public void GoToOptionUI(){

UIManager.Instance.PushUserInterface ("UIoption");

}

UIOption:

public override void UserInterfaceEnter (){

GetComponent().worldCamera = Camera.main;

gameObject.SetActive (true);}

public override void UserInterfacePause ()

{gameObject.SetActive (false);}

public override void UserInterfaceResume ()

{gameObject.SetActive (true);}

public override void UserInterfaceExit ()

{gameObject.SetActive (false);}

// ?Option界面:后退Button添加監聽事件

public void Back(){

UIManager.Instance.PopUserInterface ();

}

到這一步,就完成了兩個UI界面的切換

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容