UI框架簡介（六）
大家看了前面的那麼多理論程式碼，相信都對框架裡面的東西有一定的掌握了吧！下面我會帶著大家一起來開發揹包功能。
這裡我說一下一般公司開發專案的簡要流程哦！首先由策劃根據使用者等提出各種需求，然後在專案開始前，所有人員會開一個專案分析會，美術人員，策劃人員，程式前後端人員。開完會以後，主程搭好框架，然後給我們。專案團隊之間的交流一般用svn。然後明確你在框架中開發東西。比如，我們拿到的任務就是開發揹包模組。
下面我們就揹包模組進行開發：
拿到需求了！我們首先需要拼UI揹包面板，拼好以後去存預製物。然後去看框架，看完以後。我們來開發。記住所有的開發都是從資料層入手的！那麼我們來建立BagModule類。繼承自框架中的BaseProxy 父類。
****************揹包模組開發************************
父類沒有什麼好說的，自己看吧！具體功能在子類呢！
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
/// <summary>
/// 所有資料的父類
/// </summary>
public class BaseProxy
{
/// <summary>
/// 初始化資料
/// </summary>
public virtual void 下面我們開發子類，記好了哦！這是資料層的開發哦！
using System;
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
/// <summary>
/// 管理揹包從從伺服器接接收的資料和向伺服器請求後，伺服器做出迴應的資料
/// </summary>
public class BagModule : BaseProxy
{
#region 單例模式
private static BagModule _instance;
public static BagModule GetInstance
{
get
{
if (_instance == null)
{
_instance = new BagModule();
}
return _instance;
}
}
#endregion
/// <summary>
/// 存放接收資料的列表
/// </summary>
private List<ItemData> bagList = new List<ItemData>();
/// <summary>
/// 建構函式
/// </summary>
public BagModule()
{
}
public override void Init()
{
this.RegisterListener();
}
public override void Logout()
{
this.RemoveListener();
}
/// <summary>
/// 偵聽伺服器發過來的資料
/// </summary>
public override void RegisterListener()
{
#region 偵聽伺服器層資料
//S2C_Bag_AddData告訴全部揹包資料的
//伺服器向我們傳送資訊
CEventDispatcher.GetInstance().AddEventListener(CEventType.S2C_Bag_SetAllData, OnSetAllData);
CEventDispatcher.GetInstance().AddEventListener(CEventType.S2C_Bag_RemoveData, OnRemoveData);
CEventDispatcher.GetInstance().AddEventListener(CEventType.S2C_Bag_AddData, OnSetAddData);
#endregion
#region 偵聽顯示層（View）資料
CEventDispatcher.GetInstance().AddEventListener(CEventType.Bag_UserItem, SendUseItem);
#endregion
}
/// <summary>
/// 移除偵聽事件
/// </summary>
public override void RemoveListener()
{
#region 移除偵聽伺服器層資料
CEventDispatcher.GetInstance().RemoveEventListener(CEventType.S2C_Bag_SetAllData, OnSetAllData);
CEventDispatcher.GetInstance().RemoveEventListener(CEventType.S2C_Bag_RemoveData, OnRemoveData);
CEventDispatcher.GetInstance().RemoveEventListener(CEventType.S2C_Bag_AddData, OnSetAddData);
#endregion
#region 移除偵聽顯示層（View）資料
CEventDispatcher.GetInstance().RemoveEventListener(CEventType.Bag_UserItem, SendUseItem);
#endregion
}
#region 偵聽事件的回撥函式
/// <summary>
/// 設定所有揹包資料
/// </summary>
/// <param name="evt"></param>
private void OnSetAllData(CBaseEvent evt)
{
while (bagList.Count > 0)
{
bagList.RemoveAt(0);
}
bagList = evt.Sender as List<ItemData>;
//拿到資料然後派發事件 讓顯示層去更新顯示
CEventDispatcher.GetInstance().DispatchEvent(new CBaseEvent(CEventType.Bag_UpdataData, bagList));
}
/// <summary>
/// 移除資料
/// </summary>
/// <param name="evt"></param>
private void OnRemoveData(CBaseEvent evt)
{
for (int i = 0; i < bagList.Count; i++)
{
if (bagList[i].itemId == (evt.Sender as ItemData).itemId)
{
//bagList.Remove(bagList[i]);
bagList.RemoveAt(i);
break;
}
}
//更新資料以後派發事件 讓顯示層去更新顯示
CEventDispatcher.GetInstance().DispatchEvent(new CBaseEvent(CEventType.Bag_UpdataData, bagList));
}
/// <summary>
/// 新增揹包資料
/// </summary>
/// <param name="evt"></param>
private void OnSetAddData(CBaseEvent evt)
{
//揹包中是否有資料了
bool isHas = false;
for (int i = 0; i < bagList.Count; i++)
{
//如果找到相等的直接覆蓋之前的（注意：伺服器推過來的物件ItemData 包含了各種id，num等資訊）
if (bagList[i].itemId == (evt.Sender as ItemData).itemId)
{
bagList[i] = evt.Sender as ItemData;
isHas = true;
break;
}
}
if (!isHas)
{
//注意：伺服器推過來的物件ItemData 包含了各種id，num等資訊
bagList.Add(evt.Sender as ItemData);
}
//更新資料以後派發事件 讓顯示層去更新顯示
CEventDispatcher.GetInstance().DispatchEvent(new CBaseEvent(CEventType.Bag_UpdataData, bagList));
}
#endregion
#region 向伺服器傳送的請求資料（發過去以後，由伺服器去做偵聽，我， 不需要管，而我們和後端通訊的就是這些事件了）
public void SendGetAllData()
{
CEventDispatcher.GetInstance().DispatchEvent(new CBaseEvent(CEventType.C2S_Bag_GetAllData));
}
public void SendGetItem(CBaseEvent evt)
{
CEventDispatcher.GetInstance().DispatchEvent(new CBaseEvent(CEventType.C2S_Bag_AddItem, evt.Sender.ToString()));
}
public void SendUseItem(CBaseEvent evt)
{
CEventDispatcher.GetInstance().DispatchEvent(new CBaseEvent(CEventType.C2S_Bag_RemoveItem, evt.Sender.ToString()));
}
#endregion
}資料層開發完了以後，我們的資料都有了。下面我們應該做顯示層了吧！因為我們這個簡單，所以我們呢！沒有C控制層的。下面來看顯示層(V)
那麼我們一起來看這個六大子類中的揹包類吧！
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
using DG.Tweening;
using System;
using Newtonsoft.Json;
/// <summary>
/// 揹包預製物panel管理類（我們的揹包面板是要做成預製物的）
/// </summary>
public class BagPanel : BasePanel
{
private GameObject bagItem;
private CanvasGroup canvsGrounp;
private Button btnClose;
private Button btnReset;
private Transform content;
/// <summary>
/// 存放建立的BagItem
/// </summary>
private List<GameObject> bagItems = new List<GameObject>();
/// <summary>
/// 初始化方法
/// </summary>
void Awake()
{
LoadItem();
RegisterComponent();
RegiseterEvent();
}
private void RegisterComponent()
{
canvsGrounp = GetComponent<CanvasGroup>();
btnClose = transform.Find("CloseButton").GetComponent<Button>();
btnReset = transform.Find("ResetButton").GetComponent<Button>();
content = transform.Find("Scroll View/Viewport/Content");
}
/// <summary>
/// 載入揹包裡面小item的預製物的
/// </summary>
private void LoadItem()
{
bagItem = Resource.LoadPrefab("UI/BagItem");
}
void Start()
{
////新增偵聽事件（揹包更新資料事件）
//CEventDispatcher.GetInstance().AddEventListener(CEventType.Bag_UpdataData, RefreshData);
////派發使用item的事件
//CEventDispatcher.GetInstance().DispatchEvent(new CBaseEvent(CEventType.Bag_UserItem, "99"));
if (canvsGrounp == null)
{
//獲取CanvasGroup元件
canvsGrounp = GetComponent<CanvasGroup>();
}
//向伺服器主動請求資料的
BagModule.GetInstance.SendGetAllData();
}
/// <summary>
/// 註冊偵聽的
/// </summary>
private void RegiseterEvent()
{
btnClose.onClick.AddListener(delegate ()
{
UIManager.Instance.PopPanel();
});
btnReset.onClick.AddListener(delegate ()
{
});
//偵聽一條更新資料的訊息，然後做顯示
CEventDispatcher.GetInstance().AddEventListener(CEventType.Bag_UpdataData, OnUpdataData);
}
/// <summary>
/// 處理髮送過來的資料的方法
/// </summary>
/// <param name="evt"></param>
private void OnUpdataData(CBaseEvent evt)
{
List<ItemData> list = evt.Sender as List<ItemData>;
//先刪除舊的顯示物件 方法二：
//foreach (var item in bagItems)
//{
// Destroy(item.gameObject);
//}
for (int i = 0; i < bagItems.Count; i++)
{
Destroy(bagItems[i] as GameObject);
}
bagItems.Clear();
foreach (ItemData item in list)
{
//content設定父物體
//Instantiate有多個過載（預製物，父物體）
GameObject go = Instantiate(bagItem, content);
BagItem itemData = Util.Add<BagItem>(go);//新增指令碼
itemData.SetData(item);//設定資料
bagItems.Add(go);//將所有的物件管理起來
}
}
/// <summary>
/// 複寫的父類面板進入時的方法
/// </summary>
public override void OnEnter()
{
if (canvsGrounp == null)
{
canvsGrounp = GetComponent<CanvasGroup>();
canvsGrounp.alpha = 1;
canvsGrounp.blocksRaycasts = true;
}
else
{
canvsGrounp.alpha = 1;
canvsGrounp.blocksRaycasts = true;
}
//緩動動畫（利用DoTween外掛做的動畫）
Vector3 temp = transform.localPosition;
temp.x = 600;
temp.y = 0;
transform.localPosition = temp;
transform.DOLocalMoveX(0, 0.5f);//緩動
}
/// <summary>
/// 覆寫的父類面板進入時的方法
/// </summary>
public override void OnExit()
{
canvsGrounp.blocksRaycasts = false;
//OnComplete後面可以跟一個回撥函式
transform.DOLocalMoveX(600, 0.5f).OnComplete(() => canvsGrounp.alpha = 0);
}
/// <summary>
/// 覆寫的父類面板暫停時的方法
/// </summary>
public override void OnPause()
{
canvsGrounp.blocksRaycasts = false;
}
/// <summary>
/// 覆寫的父類面板繼續時的方法
/// </summary>
public override void OnResume()
{
canvsGrounp.blocksRaycasts = true;
}
}由於我們的揹包離裡面有單個的小物件item吧，即揹包裡面的物品。我們需要再建立一個類。
using System;
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
/// <summary>
/// 揹包中臨時Item（物品管理類）
/// </summary>
public class BagItem : MonoBehaviour
{
//item上面的引用
private ItemData itemData;
private Button btn;
private Text itemNum;
private Text itemName;
private Image itemIcon;
// Use this for initialization
void Awake()
{
RegisterComponent();
RegiseterEvent();
}
/// <summary>
/// 查詢元件
/// </summary>
private void RegisterComponent()
{
itemIcon = transform.Find("itemIcon").GetComponent<Image>();
btn = transform.Find("itemButton").GetComponent<Button>();
itemName = transform.Find("itemName").GetComponent<Text>();
itemNum = transform.Find("itemNum").GetComponent<Text>();
}
/// <summary>
/// 移除偵聽
/// </summary>
private void RegiseterEvent()
{
btn.onClick.AddListener(delegate ()
{
CEventDispatcher.GetInstance().DispatchEvent(new CBaseEvent(CEventType.Bag_UserItem, itemData.itemId));
});
}
/// <summary>
/// 設定資料
/// </summary>
/// <param name="data"></param>
public void SetData(ItemData data)
{
itemData = data;
RefreshView();
}
/// <summary>
/// 做顯示的方法
/// </summary>
private void RefreshView()
{
//print("images/equip/" + itemData.itemIcon);
Sprite sprite = Resource.LoadSprite("images/equip/" + itemData.itemIcon);
if (sprite == null)
{
Debug.LogError("sprite is null !!!");
}
itemIcon.sprite = sprite;
itemName.text = itemData.itemName;
itemNum.text = itemData.itemNum;
btn.GetComponent<Image>().sprite = sprite;
}
}
小item上面的元件。
好了！這些就是實戰開發揹包模組了哦！不懂的話歡迎私聊QQ哦！
希望這些可以幫助到大家哦！
本篇小結：本篇主要想大家講解了揹包模組是如何開發出來的哦！這只是六大模組中的一個小部分模組哦！大家要是有時間的話，就去開發其他模組練練手嘛！如果沒有策劃的話，建議自己去體驗當前比較火的手遊王者榮耀哦！它裡面的功能還是比較多的！還有一點，作為程式設計師的我們，有空一定要多多體驗遊戲，因為你體驗的多了，才會有新的見識哦！好了，就寫這麼多吧！馬上就要春節了，也是我們的休息時間了哦！最後感謝大家的閱讀，祝大家新年快樂哦！不懂的地方歡迎私聊QQ哦！QQ在前面部落格中有哦！
相關推薦
UI框架簡介（六）
大家看了前面的那麼多理論程式碼，相信都對框架裡面的東西有一定的掌握了吧！下面我會帶著大家一起來開發揹包功能。 這裡我說一下一般公司開發專案的簡要流程哦！首先由策劃根據使用者等提出各種需求，然後在專案開始前，所有人員會開一個專案分析會，美術人員，策劃人員，程式前
UI框架簡介（一）
好久沒有寫部落格了，前一陣公司太忙了，作為程式設計師的我們天天累成狗啊！不過每年都是這樣的啦！誰讓馬上就到年底了呢，專案要緊啊！這不昨天才放假的嘛！哎！可能是職業習慣吧！一天不寫程式碼感覺沒有什麼意思了！但是想寫又不想寫。對了！那就寫點部落格吧！以供大家互相交流
UI框架簡介（五）
下面我們來講解事件層程式碼了哦！這個也比較難的哦！如果一會你實在看不懂理解不了也沒有關係，因為這些東西吧！只要會用就行，會和後端定協議就可以哦！協議一會我來教你怎麼定吧！首先我們來看看如何與後端定訊息哦！ 這是一個列舉3型別，用來訂閱訊息的： public
UI框架簡介（四）
繼續上篇內容哦！那麼我們就先看Basepanel類，它是所有面板的父類，提供了一些共同的方法。 六大子類：那麼我們就以任務面板模組為例子吧！進行講解哦！下面的程式碼我們一字一句的看哦！看看到底是幹啥的！後面我會帶大家開發揹包模組時再進行重點講解揹包模組的哦
UI框架簡介（二）
接著前面的寫哦！想必大家已經把我所提供的框架工程已經下載好了吧！接下你要做的就是開啟unity和Vs軟體跟著我繼續往下面操作哦！（PS：如果連結失效的話：可以私聊QQ：2962562060哦！） 先來幾張圖片吧！ 看完了這幾張圖片，什麼感覺啊？就是一
Python 各種測試框架簡介（三）：nose
調用 QQ upm href 命令 math 一點 發現 方法 轉載：https://blog.csdn.net/qq_15013233/article/details/52527260 摘要 這裏將從（pythontesting.net）陸續編譯四篇 Python 測試框
Tornado框架簡介（二）
IT ali cati tput 靜態 特定 with 命名方式 method --------------------Application--------------------1、settings1、debug=True：，設置tornado是否工作在調試模式，默認為
【從零開始搭建自己的.NET Core Api框架】（六）泛型倉儲的作用
tar write ges 分享圖片 () dex 抽象 .sql cut 系列目錄 一. 創建項目並集成swagger 1.1 創建 1.2 完善 二. 搭建項目整體架構 三. 集成輕量級ORM框架——SqlSugar 3.1 搭建環境 3.2 實戰篇：
WPF Interaction框架簡介（一）——Behavior
原文: WPF Interaction框架簡介（一）——Behavior 在WPF 4.0中，引入了一個比較實用的庫——Interactions，這個庫主要是通過附加屬性來對UI控制元件注入一些新的功能，除了內建了一系列比較好用的功能外，還提供了比較良好的擴充套件介面。本文這裡簡單的介紹一下Behavior
redis基礎簡介（六）- jedis使用管道（pipeline）對redis進行讀寫（使用hmset、hgetall測試）
一般情況下，Redis Client端發出一個請求後，通常會阻塞並等待Redis服務端處理，Redis服務端處理完後請求命令後會將結果通過響應報文返回給Client。這有點類似於HBase的Scan，通常是Client端獲取每一條記錄都是一次RPC呼叫服務端。在Redis中，有沒有類似HBase Scan
AndroidO audio系統之框架簡介（一）
1、概述 Audio系統在Android中負責音訊方面的資料流傳輸和控制功能，也負責音訊裝置的管理，它是Android中最複雜的子系統之一。本文將粗略分析一下audio的整體框架及播放、錄製流程。不足之處，敬請指正，謝謝！ 2、音訊框架圖
Android 谷歌 開源 通訊框架 VOLLEY（六）——應用例項
五、應用例項 package com.example.test; import com.android.volley.Request; import com.android.volley.RequestQueue; import com.android.vo
Javascript測試框架Jasmine（六）：非同步程式碼測試
zz from:http://keenwon.com/1223.html 模擬Timeout Jasmine Clock 可以用來測試setTimeout 和setInterval 的回撥操作。它使回撥函式同步執行，當Clock的時間超過timer的時間，回撥函式
Google C++單元測試框架---Gtest框架簡介（譯文）
一、設定一個新的測試專案 在用google test寫測試專案之前，需要先編譯gtest到library庫並將測試與其連結。我們為一些流行的構建系統提供了構建檔案: msvc/ for Visual Studio, xcode/ for Mac Xcode, make/
Android View框架總結（六）View佈局流程之Draw過程
View的Draw時序圖ViewRootImpl.performTraversals過程ViewRootImpl.performDraw過程View.draw方法View.dispatchDraw過程LinearLayout的onDraw過程 View的Draw時序圖
Qt使用教程之使用Qt Quick UI表單（六）
建立選單 嚮導新增一個選單欄到main.qml檔案中，這其中包含了一個具有Open和Exit選單的File選單。儲存選單和Exit選單項，然後新增具有標準選單項的Edit和Help選單。 該向導將建立下面的程式碼： 1
Google C++單元測試框架---Gtest框架簡介（譯文）[轉載]
一、設定一個新的測試專案 在用google test寫測試專案之前，需要先編譯gtest到library庫並將測試與其連結。我們為一些流行的構建系統提供了構建檔案: msvc/ for Visual Studio, xcode/ for Mac Xcode, make/ f
spring框架學習（六）AOP
AOP(Aspect-OrientedProgramming)面向方面程式設計，與OOP完全不同，使用AOP程式設計系統被分為方面或關注點，而不是OOP中的物件。 AOP的引入 在OOP面向
java集合框架總結（六）
一、Map 簡介 Map 用於儲存具有對映關係的資料，因此 Map 集合裡儲存著兩組值，一組值用於儲存 Map 裡的 Key，另外一組用於儲存 Ma
Unity 客戶端框架（六）：UI框架
public abstract class BaseUI : MonoBehaviour { #region 快取 private Transform _CachedTransform; public Transform cachedTransform