接下来我们将制作一个UI系统，凡事都是从简单的设计开始。
我们将UI设计成一个树状结构，上一个节点的UILayer可以创建新的UILayer。我们通过对堆的调用，push和pop来表示新建和删除，毕竟通常UI都是树一样的，点击哪里，跳出来一片UI，然后返回，在回到上一个节点UI。我们首先来实装小姐姐的基础数据UI化，比如血量显示什么的，以下是代码设计。
首先制作一个工具类UGUITools
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
//最好加上命名空间
public static class UGUITools {
/// <summary>
/// 添加新的UI
/// </summary>
/// <param name="parent">父节点</param>
/// <param name="prefab">创造物</param>
/// <returns></returns>
public static GameObject AddLayerChild(GameObject parent, GameObject prefab) {
GameObject go = GameObject.Instantiate(prefab) as GameObject;
if (go != null && parent != null) {
RectTransform t = go.GetComponent<RectTransform>();
t.SetParent(parent.transform);
t.offsetMax = Vector2.zero;
t.offsetMin = Vector2.zero;
t.anchorMin = Vector2.zero;
t.anchorMax = Vector2.one;
t.anchoredPosition = Vector3.zero;
t.localScale = Vector3.one;
go.layer = parent.layer;
}
return go;
}
/// <summary>
/// 在layer的创建组件
/// </summary>
/// <param name="parent"></param>
/// <param name="prefab"></param>
/// <returns></returns>
public static GameObject AddComponentChild(GameObject parent, GameObject prefab) {
GameObject go = GameObject.Instantiate(prefab) as GameObject;
if (go != null && parent != null) {
RectTransform t = go.GetComponent<RectTransform>();
t.SetParent(parent.transform);
t.anchoredPosition = Vector3.zero;
t.localScale = Vector3.one;
go.layer = parent.layer;
}
return go;
}
}
创建一个Layer的ID管理类AppStatelds
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
public enum AppStateIds {
kAppStateIdNone = 0,
kAppStateIdPlayerLayer = 1,
}
创建一个所有UI view的父类。APPUIViewBase
using strange.extensions.mediation.impl;
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
public class APPUIViewBase:View {
View viewParent;//获得创建自己的View节点。
View state;//当前View节点，
Stack<APPUIViewBase> viewStack;
virtual public void init() {
viewStack = new Stack<APPUIViewBase>();
}
void setParentMessageListener(View view) {
this.viewParent = view;
}
public View getParentMessage() {
return viewParent;
}
APPUIViewBase createLayer(AppStateIds appStateIds, GameObject UIlayer) {//这里先用预置体的形势，将来在使用AB包。
GameObject go = null;
APPUIViewBase view = null;
switch (appStateIds) {
case AppStateIds.kAppStateIdPlayerLayer:
go = UGUITools.AddLayerChild(gameObject, UIlayer);
if (go != null) {
view = go.GetComponent<APPUIViewBase>();
}
break;
}
return view;
}
protected APPUIViewBase pushLayer(AppStateIds appStateIds, GameObject UIlayer) {//推入一个UI节点
APPUIViewBase view = createLayer(appStateIds, UIlayer);
if (view != null) {
state = view;
view.setParentMessageListener(view);
viewStack.Push(view);
}
return view;
}
protected void popLayer() {//将最后加入的节点推出。
//以后在做实现。
}
}
创建一个所有UIMediator的父类APPUIMediatorBase
using strange.extensions.mediation.impl;
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
public class APPUIMediatorBase : Mediator{
//用于Signal管理，以后在写
}
接着创建一个UIRoot类，作为最初的根节点。UIRootView
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
public class UIRootView:APPUIViewBase {
public GameObject playerBaseLayer;
public override void init() {
base.init();
pushLayer(AppStateIds.kAppStateIdPlayerLayer, playerBaseLayer);//创建layer层
}
}
创建UIRoot的管理类，UIRootMediator
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
public class UIRootMediator:APPUIMediatorBase {
[Inject]
public UIRootView _UIRootView { get; set; }
public override void OnRegister() {//绑定成功之后会调用这个API
_UIRootView.init();
Debug.Log("UIRootMediator_OnRegister");
}
public override void OnRemove() {//解除绑定之后调用这个API
Debug.Log("UIRootMediator_OnRemove");
}
}
创建小姐姐的基础数据实装的类UIPlayerBaseDateView
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
public class UIPlayerBaseDateView:APPUIViewBase {
[Header("需要加载的组件")]//这部分将来会采用AB包的形式加载
public GameObject HPGroup;//用于放置血量的父节点
public GameObject HP;//血量Icon
[Header("私有成员")]//将来也许会将这种小部件也独立出来，那么整个layer就只需要插拔这种小部件就可以了。
private List<GameObject> HPList;//血Icon存储。
private RectTransform HPGroup_Tf;//放置血Icon的父节点
private Transform playerBaseDateLayer;//整个UI
public override void init() {
playerBaseDateLayer = transform;
HPList = new List<GameObject>();
}
public void createOrUpdateHP(PlayerBaseData playerBaseData) {
if (HPGroup_Tf == null) {
GameObject go = UGUITools.AddComponentChild(playerBaseDateLayer.gameObject, HPGroup);
HPGroup_Tf = go.GetComponent<RectTransform>();
HPGroup_Tf.anchoredPosition = new Vector3(75, -75, 0);
}
for (int i = 0; i < playerBaseData.HP; i++) {
GameObject HP_GO = null;
if (HPList.Count > i) {//如果储存列表中有这个HP对象
HP_GO = HPList[i];
} else {//如果储存对象没有这个储存对象。
HP_GO = UGUITools.AddComponentChild(HPGroup_Tf.gameObject, HP);
HPList.Add(HP_GO);
}
HP_GO.gameObject.SetActive(true);
}
for (int i = playerBaseData.HP; i < HPList.Count; i++) {
HPList[i].gameObject.SetActive(false);
}
}
}
创建小姐姐的数据实例化的管理类。UIPlayerBaseDateMediator
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
public class UIPlayerBaseDateMediator :APPUIMediatorBase {
[Inject]
public UIPlayerBaseDateView _UIPlayerBaseDateView { get; set; }
[Inject]
public PlayerBaseDataSignal playerBaseDataSignal { get; set; }//返回给我们的带着数据的信号
[Inject]
public CallMadelPlyerBaseDataSignal callMadelPlyerBaseDataSignal { get; set; }//发出我想要数据的信号。
public override void OnRegister() {//绑定成功之后会调用这个API
_UIPlayerBaseDateView.init();
playerBaseDataSignal.AddListener(setPlayerData);
callMadelPlyerBaseDataSignal.Dispatch();//去找Model要player的数据
Debug.Log("UIPlayerBaseDateMediator_OnRegister");
}
public override void OnRemove() {//解除绑定之后调用这个API
playerBaseDataSignal.RemoveListener(setPlayerData);
Debug.Log("UIPlayerBaseDateMediator_OnRemove");
}
void setPlayerData(PlayerBaseData playerBaseData) {//将角色的数据呈现在UI上
Debug.Log("UI接受道回调");
_UIPlayerBaseDateView.createOrUpdateHP(playerBaseData);
}
}
最后进行绑定
mediationBinder.Bind<UIPlayerBaseDateView>().To<UIPlayerBaseDateMediator>();
mediationBinder.Bind<UIRootView>().To<UIRootMediator>();
接着进行配置，在Prefabs中我们制作了预置体，这三个文件夹存放关系。
UI_Layers->(PlayerBaseDataLayer)
UI_Groups->(HPGroup)
UI_Singles->(HPIcon)
配置
PlayerBaseDataLayer
HPGroup
HP
最后是我们的UI的根节点Canvas
根节点
网友评论