Unity3D框架插件uFrame實用參考手冊（一）

1.概覽

uFrame是提供給Unity3D開發者使用的一個框架插件，它自己模仿了MVVM這種架構模式（事實上並不包含Model部分，且多出了Controller部分）。由於用於Unity3D，因此它向開發者提供了一套基於Editor的可視化編輯工具，能夠用來管理代碼結構等。本文爲uFrame1.6版本在項目中實踐的記錄，主要包括一些uFrame中的基本概念以及應用的流程。

2.新建uFrame工程

本小節主要內容包括：

• 在uFrame新建工程

• 在uFrame的可視化編輯器中打開工程倉庫

• 在uFrame的可視化編輯器中設置工程的命名空間，用來在生成模板代碼時使用

2.1.在uFrame中新建工程

在Unity編輯器的Project部分新建一個文件夾，命名爲MyProject。選中剛剛建立的文件夾右鍵選擇：
[u]Frame->New Project。
如圖：

此時，打開MyProject文件夾，咱們建立的uFrame的工程倉庫已經建立好了。

咱們能夠對這個文件進行重命名，以符合本身的習慣。
到此，咱們就完成了在uFrame中建立一個新的工程的任務。

2.2.在uFrame的可視化編輯器中打開工程倉庫

建立完uFrame的工程以後，咱們就能夠在uFrame提供的可視化編輯器（graph designer）中打開該工程了。
點擊Editor的工具欄，選中Window->uFrame Designer:

在uFrame的編輯器中，咱們能夠選擇咱們剛剛建立的uFrame工程。

這樣，咱們就在uFrame的編輯器中打開了剛剛建立的uFrame工程了。

2.3.設置工程的命名空間

因爲uFrame的這套可視化編輯器的目的是爲了向開發人員提供便利的開發方式，其最後仍是要生成一些模板代碼的。所以，咱們能夠設置一些信息，以生成對應的模板代碼。例如，咱們能夠在這裏設置工程的命名空間，這樣生成的代碼都會在咱們設置的命名空間內。
選中在2.1中生成的工程倉庫文件，咱們在它的inspector面板中能夠設置這個工程的命名空間。

至此，整個工程的基本設置就已經完成了，下面咱們繼續進一步進行一些具體的操做。

3.建立子系統

本小節主要內容包括：

• 介紹uFrame中圖（Graph）的概念

• 建立一個MVVM圖（MVVM Graph）

• 建立一個子系統圖（Subsystem Graph）

3.1.uFrame中的圖（graph）

在建立子系統以前，咱們首先要了解一個概念，即uFrame中的圖（Graph）。此處說的圖是uFrame中的一個概念，uFrame工程中的每個圖都會以文件的形式存在於工程的文件夾中。每個圖均可以包含不少的結點（Node），並且圖和圖之間也能夠共享同一個工程中的節點。
咱們能夠經過uFrame的可視化編輯器（designer）來建立一個圖，在designer的左側咱們能夠打開圖的選擇框：

選擇框中列出的是能夠建立的圖的類型。
須要咱們注意的是，此時建立的圖會自動和此時選中的工程連接，且圖文件會在被選中的工程的文件夾中建立。

3.2.建立MVVM圖

此時，咱們須要爲咱們的工程建立一個MVVM圖，因此在上面的圖的選擇框中咱們選擇Create MVVMGraph。
咱們能夠看到建立完以後，這個圖只包括一個節點（Node），該節點表明圖自己，咱們能夠稱它爲圖節點（Graph node）。

並且，一個圖文件也在咱們的工程文件夾中被建立了出來。

若是須要修改圖的名字，咱們能夠直接在designer中修改圖節點的名字，右鍵點擊節點，選擇Rename便可。

3.3.建立子系統圖

下面就讓咱們在MVVM圖之下添加一些子系統，來豐富這個工程的功能吧。
咱們只須要在空白處點擊右鍵，便可彈出一個選擇菜單：

選擇Add Sub System便可在FoxMain環境中添加一個子系統了。
注意：此處須要提醒各位注意，不一樣的環境下選擇菜單的內容是不一樣的，可添加的元素也不一樣，例如在此處的MVVM Kernel圖中咱們能夠建立SubSystem，而Element節點只能在SubSystem中建立，一樣，View節點只能在Element節點中建立。因此想要建立目標節點時，必定要肯定如今的環境（能夠經過左上角看到當前所在的環境，例如如今是FoxMain）。

4.建立節點(Node)

本小節主要內容包括：

• 解釋什麼是Element節點並建立Element節點

• 解釋什麼是View節點並建立View節點

4.1.Element節點

在designer中，Element節點主要定義了ViewModel和Controller，Element中的數據主要有三部分組成：

• 屬性Property，主要是單個數據

• 集合Collection，主要是數據集合

• 命令Command，主要定義了一些命令，由Controller執行。

因爲它們是常規的C#類型，並無繼承Unity3D中的Monobehaviour，所以它們不依賴Unity3D，因此它們是可移植的。
而在Unity3D中，咱們經過建立和Unity3D相關的View來綁定ViewModel，從而表現ViewModel中的數據。
下面咱們就在剛剛建立的UISys子系統中建立一個Element節點，並命名爲Login。

右鍵點擊designer的空白處，能夠彈出一個選擇菜單，其中包括不少Add選項，例如Command、Element等等。選擇Add Element，一個名爲Login的Element節點便被建立出來了。

注意：觀察designer的左上角，能夠看到咱們此時處在UISys中，即咱們如今在UISys圖（graph）中。之因此要在此提示各位注意這一點，是因爲節點能夠以子系統的圖節點爲目標添加，也能夠以別的節點爲目標添加，若是咱們雙擊Login節點，就變成了以Login節點爲目標添加。

4.2.View節點

在Unity3D開發中，View部分指的就是Unity3D爲咱們提供的視覺方面的操做對象，例如遊戲內的物體、UI等等。
View是展現層，它經過綁定ViewModel來展現ViewModel中的數據。舉一個例子各位可能會更容易理解這個意思：假設咱們的遊戲中有一個PlayerViewModel，針對這一個ViewModel咱們在遊戲中能夠有多種表現方式，例如：咱們能夠有一個PlayerView對應遊戲中的玩家模型，根據ViewModel中的數據展現各類動做、或者位移。也能夠有一個PlayerInfoView對應遊戲中的玩家數據UI，根據同一個ViewModel中的數據，展示例如玩家血量、經驗值等等信息。
而綁定了同一個ViewModel的多個View的不一樣之處就在於，各個View只關注ViewModel上它們所須要的數據，各個View之間也應該儘量的保持獨立性。
那麼下面咱們就來建立一個View節點。
雙擊Login節點進入以Login爲目標的環境，和建立Element節點的過程相似，右鍵點擊空白處彈出選擇菜單，此次菜單中包括Add View的選項，以下圖：

（咱們還能夠看到左上角已經從以前的UISys變成了如今的Login）
這樣，一個View節點便被建立出來了。
如今分別表明ViewModel和View的節點已經被建立出來了，接下來咱們就要建立ViewModel上的數據了。