Unity UGUI 實作篇 (一)：介面系統 UI Manager 動態開啟、關閉、顯示、隱藏 UI 介面

本系列其他文章

Unity UGUI 實作篇 (一)：介面系統 UI Manager 動態開啟、關閉、顯示、隱藏 UI 介面
Unity UGUI 實作篇 (二)：Scroll View 實作與動態建立子元素並賦值
Unity UGUI 實作篇 (三)：使用 UI Toggle 建立遊戲中頁籤
Unity UGUI 實作篇 (四)：在 UI 中顯示 3D Model
Unity UGUI 實作篇 (五)：使用 UI Slider 製作遊戲中血條、數值條
Unity UGUI 實作篇 (六)：使用 UI Dropdown 下拉選單，製作遊戲中資料排序功能

使用環境與版本

Window 7
Unity 5.2.4

影片教學

這次的教學使用影片方式呈現，也是我第一次製作影片教學，歡迎多多指教，如果大家喜歡這個方式的話，後續此系列都會採用此方式

Script

UIManager.cs

using UnityEngine;
using System.Collections.Generic;

public class UIManager : Singleton<UIManager>
{
    private string UI_GAMEPANEL_ROOT = "Prefabs/GamePanel/";

    public GameObject m_CanvasRoot;

    public Dictionary<string, GameObject> m_PanelList = new Dictionary<string, GameObject>();



    private bool CheckCanvasRootIsNull()
    {
        if (m_CanvasRoot == null)
        {
            Debug.LogError("m_CanvasRoot is Null, Please in your Canvas add UIRootHandler.cs");
            return true;
        }
        else
        {
            return false;
        }
    }

    private bool IsPanelLive(string name)
    {
        return m_PanelList.ContainsKey(name);
    }

    public GameObject ShowPanel(string name)
    {
        if (CheckCanvasRootIsNull())
            return null;

        if (IsPanelLive(name))
        {
            Debug.LogErrorFormat("[{0}] is Showing, if you want to show, please close first!!", name);
            return null;
        }

        GameObject loadGo = Utility.AssetRelate.ResourcesLoadCheckNull<GameObject>(UI_GAMEPANEL_ROOT + name);
        if (loadGo == null)
            return null;


        GameObject panel = Utility.GameObjectRelate.InstantiateGameObject(m_CanvasRoot, loadGo);
        panel.name = name;


        m_PanelList.Add(name, panel);


        return panel;
    }

    public void TogglePanel(string name, bool isOn)
    {
        if (IsPanelLive(name))
        {
            if (m_PanelList[name] != null)
                m_PanelList[name].SetActive(isOn);
        }
        else
        {
            Debug.LogErrorFormat("TogglePanel [{0}] not found.", name);
        }
    }

    public void ClosePanel(string name)
    {
        if (IsPanelLive(name))
        {
            if (m_PanelList[name] != null)
                Object.Destroy(m_PanelList[name]);

            m_PanelList.Remove(name);
        }
        else
        {
            Debug.LogErrorFormat("ClosePanel [{0}] not found.", name);
        }
    }

    public void CloseAllPanel()
    {
        foreach (KeyValuePair<string, GameObject> item in m_PanelList)
        {
            if (item.Value != null)
                Object.Destroy(item.Value);
        }

        m_PanelList.Clear();
    }

    public Vector2 GetCanvasSize()
    {
        if (CheckCanvasRootIsNull())
            return Vector2.one * -1;

        RectTransform trans = m_CanvasRoot.transform as RectTransform;

        return trans.sizeDelta;
    }

}

100

101

102

103

104

105

106

107

using UnityEngine;

using System.Collections.Generic;

public class UIManager : Singleton<UIManager>

{

private string UI_GAMEPANEL_ROOT = "Prefabs/GamePanel/";

public GameObject m_CanvasRoot;

public Dictionary<string, GameObject> m_PanelList = new Dictionary<string, GameObject>();

private bool CheckCanvasRootIsNull()

{

if (m_CanvasRoot == null)

{

Debug.LogError("m_CanvasRoot is Null, Please in your Canvas add UIRootHandler.cs");

return true;

}

else

{

return false;

}

private bool IsPanelLive(string name)

{

return m_PanelList.ContainsKey(name);

}

public GameObject ShowPanel(string name)

{

if (CheckCanvasRootIsNull())

return null;

if (IsPanelLive(name))

{

Debug.LogErrorFormat("[{0}] is Showing, if you want to show, please close first!!", name);

return null;

}

GameObject loadGo = Utility.AssetRelate.ResourcesLoadCheckNull<GameObject>(UI_GAMEPANEL_ROOT + name);

if (loadGo == null)

return null;

GameObject panel = Utility.GameObjectRelate.InstantiateGameObject(m_CanvasRoot, loadGo);

panel.name = name;

m_PanelList.Add(name, panel);

return panel;

}

public void TogglePanel(string name, bool isOn)

{

if (IsPanelLive(name))

{

if (m_PanelList[name] != null)

m_PanelList[name].SetActive(isOn);

}

else

{

Debug.LogErrorFormat("TogglePanel [{0}] not found.", name);

}

public void ClosePanel(string name)

{

if (IsPanelLive(name))

{

if (m_PanelList[name] != null)

Object.Destroy(m_PanelList[name]);

m_PanelList.Remove(name);

}

else

{

Debug.LogErrorFormat("ClosePanel [{0}] not found.", name);

}

public void CloseAllPanel()

{

foreach (KeyValuePair<string, GameObject> item in m_PanelList)

{

if (item.Value != null)

Object.Destroy(item.Value);

}

m_PanelList.Clear();

}

public Vector2 GetCanvasSize()

{

if (CheckCanvasRootIsNull())

return Vector2.one * -1;

RectTransform trans = m_CanvasRoot.transform as RectTransform;

return trans.sizeDelta;

}

UIRootHandler.cs

using UnityEngine;

public class UIRootHandler : MonoBehaviour {
	void Awake () {
            UIManager.Instance.m_CanvasRoot = gameObject;
	}
}

using UnityEngine;

public class UIRootHandler : MonoBehaviour {

void Awake () {

UIManager.Instance.m_CanvasRoot = gameObject;

}

參考資料

歡迎轉載，並註明出處 !

18 thoughts to “Unity UGUI 實作篇 (一)：介面系統 UI Manager 動態開啟、關閉、顯示、隱藏 UI 介面”

0.0表示:

2016-07-2311:39:33

感謝教學~~真的很棒!
另外有個小小建議希望講解程式碼的時候可以把游標移走不然看不清楚@o@(例如影片8:32左右會擋到旁邊的字)
期待接下來的教學~

回覆
1. k79k06k02k表示:
  
  2016-07-2313:31:38
  
  感謝您的建議與支持喔~~ 😮
  
  回覆
kk表示:

2016-11-0415:55:38

什么时候更新后续的内容呢？期待后面的内容

回覆
1. k79k06k02k表示:
  
  2016-11-0416:00:24
  
  最近项目较忙，感谢您的支持与建议!
  
  回覆
bill表示:

2017-01-1912:52:22

請問為什麼我在按下Show的按鈕後PanelA沒有出現在Canvas裡，而是在Canvas外?

回覆
1. k79k06k02k表示:
  
  2017-01-2009:56:02
  
  請檢查 UIManager.cs ，此方法是在父物件下建立子物件
  
  Line 48.
  GameObject panel = Utility.GameObjectRelate.InstantiateGameObject(m_CanvasRoot, loadGo);
  
  影片中有說明此方法
  https://youtu.be/-_jw6gkmgDg?t=385
  
  回覆
Nald表示:

2017-03-2001:02:58

我前一則留言好像被吃了QWQ只好再重新問了
想問一下Arkai大，場景中的物件上掛的程式，能否抓取已載入的Panel的子物件呢？
萬分感謝！

回覆
1. Arkai表示:
  
  2017-03-2009:11:50
  
  較好的做法是在 Panel 上掛一個 Script，再把 Panel 的子物件指定給 Script Component
  每個 Panel 獨立運作管理
  
  回覆
小宇表示:

2017-07-1217:29:35

不好意思我想請問您~為什麼我在打下面這個的時候
OnBtnShowClick底下會出現紅線,
然後這個程式碼丟到上面會顯示please fix compile errors before creating new script components~

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class P : MonoBehaviour {

public virtual OnBtnShowClick()
{
UIManager.Instance.ShowPanel(“PanelA”)
}
}

回覆
1. Arkai表示:
  
  2017-07-1223:59:25
  
  你好，問題為語法錯誤
  正確方法寫法如下
  
  C#
  
  public void OnBtnShowClick() { UIManager.Instance.ShowPanel("PanelA"); }
  
  1
  2
  3
  4
  
  public void OnBtnShowClick()
  {
  UIManager.Instance.ShowPanel("PanelA");
  }
  
  回覆
  1. 小宇表示:
    
    2017-07-1309:29:47
    
    不好意思~我用這個寫法還是一樣不能~
    OnBtnShowClick這個還是一樣出現紅色的線
    
    回覆
    1. Arkai表示:
      
      2017-07-1311:36:29
      
      HI 請把檔案或是專案給我吧
      直接看比較快
      
      回覆
Zn表示:

2017-09-1418:57:11

阅读后受益匪浅，期待后续的二三四五六

回覆
a2550512表示:

2017-10-2000:34:26

期待續篇～！！這幫了我很大的忙！！

回覆
自動引用通知: 專題、人際、生活、文字語言
Jerome Chung表示:

2018-04-1817:22:54

感謝，獲益良多

回覆
Cecer Lin表示:

2018-06-0717:16:03

超棒的我剛開始學受益良多
我在Udemy買的課程都沒你說得好~~~感謝

回覆
w5487表示:

2019-03-2501:00:20

什麼時候更新後續，大大說的超好

回覆