Simple UI Framework
Develop BasePanel panel base class and instantiate creation and management of control UI panel Prefab
Article directory
1. BasePanel base class
Each panel has a common function, so each panel is given a common base class BasePanel .
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
public class BasePanel : MonoBehaviour
{
}
Let all panels be based on BasePanel so that they can be managed in UIManager .
Here BasePanel needs to inherit from MonoBehaviour , because it needs to be mounted on our scene object. We first create an empty BasePanel script, and then improve the function later.
Next we operate on each UI panel.
We only need to create a script under each UI panel, and the script inherits from BasePanel.
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
public class TextPanel : BasePanel
{
}
Next we control the UI panel.
2. Control the instantiation creation and management of UI panel Prefab
Back to our UIManager, we need to manage our UI panels here.
We are creating a dictionary to hold all the panels we instantiate.
private Dictionary<UIType, BasePanel> panelDict;//保存所以实例化面板的游戏物体身上的BasePanel组件
Key is of course the UIType of the panel , and Value can directly save the game object, as well as the components on the game object. Here I saved the BasePanel component directly.
We create a method to get the instantiated panel.
public BasePanel GetPanel(UIType panelType)
{
}
First of all, we need to check if there is such a panel in this dictionary, if not, we create this panel, if so, return this panel directly.
public BasePanel GetPanel(UIType panelType)
{
if (panelDict == null)
{
panelDict = new Dictionary<UIType, BasePanel>();
}
BasePanel panel;
panelDict.TryGetValue(panelType, out panel)；
}
How do we get this panel, divided into two steps:
1. Define a type to be obtained.
2. Call the TryGetValue method of the dictionary and pass the Key .
Next, let's judge whether the panel has been obtained.
public BasePanel GetPanel(UIType panelType)
{
if (panelDict == null)
{
panelDict = new Dictionary<UIType, BasePanel>();
}
BasePanel panel;
panelDict.TryGetValue(panelType, out panel);
if (panel == null)
{
//如果找不到，那么就找这个面板的Prefab的路径，然后去根据Prefab去实例化面板
string path;
panelPathDict.TryGetValue(panelType, out path);
GameObject instPanel = GameObject.Instantiate(Resources.Load(path)) as GameObject;
instPanel.transform.SetParent(canvasTransform);
panelDict.Add(panelType, instPanel.GetComponent<BasePanel>());
return instPanel.GetComponent<BasePanel>();
}
else
{
return panel;
}
}
If it is empty, it means that we have never instantiated the panel of this panelType, we have to use it according to
private Dictionary<UIType, string> panelPathDict;//存储所有的面板Prefab的路径
This dictionary takes the path to the Prefab to instantiate it.
Here we get the path, and then load it.
Because our panels are placed in the path under the Resource file, we can load them directly. It can be instantiated directly after loading. Here it needs to be forced to transform into the GameObject type, and the as method that cannot be used in the enumeration before is used here .
GameObject instPanel = GameObject.Instantiate(Resources.Load(path)) as GameObject;
After I create the panel, we should put the panel under our canvas Canvas.
So we need to get the canvas.
private Transform canvasTransform;
private Transform CanvasTransform
{
get
{
if (canvasTransform == null)
{
canvasTransform = GameObject.Find("Canvas").transform;
}
return canvasTransform;
}
}
We can get it through the construction method, or get it when using it. Here I choose to get it when using it, and define a Get method to get it.
Here we use the Find method in GameObject , because there is only one canvas in our scene, so we can search directly by name, and also by path. Why do we get the Transform type of the canvas? Because we want to place the newly instantiated panel under the canvas, set a parent-child relationship through the Transform component. Next go back to the GetPanel method. Next we set up the parent-child relationship and place the instantiated panel below the canvas.
instPanel.transform.SetParent(canvasTransform);
The SetParent method has two parameters, the first is the parent class to be set, and the second is whether to maintain its position on the world coordinate axis. We don’t need to keep it here, because Canvas generally has a certain scaling ratio. Putting the externally instantiated panel under Canvas will cause the scaling ratio of Canvas to become abnormal, so we can set the second parameter to false Or not.
After setting the parent class, we can directly put the instantiated panel in the dictionary and use the Add method.
Summarize
We have established the base class script BasePanel of the panel , which is convenient for us to set the common functions of the panel in the future.
At the same time, we have also set up the function of controlling the UI panel.