介面系統在遊戲中佔據重要地位。遊戲介面是否友好，很大程度上決定了玩家的體驗；介面開發是否便利，也影響著遊戲的開發進度。Unity3D 的UGUI系統，使使用者可以“視覺化地”開發介面，那麼怎樣用Lua去呼叫UGUI呢？

1、顯示UI介面

下面演示如何顯示一個UI介面。由於UI介面也是一種資源，使用第二篇“資源熱更新”的方法即可。這個例子中，製作一個含有按鈕的介面，然後組成名為Panel1的UI預設，存放到Tank目錄下。

圖：Panel1

前面（第二篇）已在Packager類HandleExampleBundle方法中添加了一句“AddBuildMap("tank" + AppConst.ExtName, "*.prefab", "Assets/Tank");”（當然也可以新增到其他地方），它會把Tank目錄下的所有預設打包成名為tank的資源包。故而點選“Build xxx Resource”後，Panel1也會被打包到tank資源包中。

修改Lua入口函式Main.lua中的Main方法，在載入資源後把panel1放到Canvas下（需要在場景中新增畫布），然後調整它的位置和大小。

--主入口函式。從這裡開始lua邏輯
function Main()					
	LuaHelper = LuaFramework.LuaHelper;
	resMgr = LuaHelper.GetResManager();
	resMgr:LoadPrefab('tank', { 'Panel1' }, OnLoadFinish);
end
 
--載入完成後的回撥--
function OnLoadFinish(objs)
	--顯示面板
	go = UnityEngine.GameObject.Instantiate(objs[0]);
	local parent = UnityEngine.GameObject.Find("Canvas")
    go.transform:SetParent(parent.transform);
    go.transform.localScale = Vector3.one;
    go.transform.localPosition = Vector3.zero;
end
 

運行遊戲，即可看到加載出來的介面。

圖：加載出來的介面

2、事件響應

c#中可以使用事件監聽的方法給UI元件新增事件。例如，新增按鈕點選事件的方法如下：

		Button btn = go.GetComponent<Button> ();
		btn.onClick.AddListener
		(
			delegate() 
			{
				this.OnClick(go)
			}
		);

然而在LuaFramework的API中，沒能找到合適的方法，只能根據第三篇中“自定義API”的方法，自己編寫一套了。編寫UIEvent類，它包含用於新增監聽事件的AddButtonClick和清除監聽事件的ClearButtonClick方法，程式碼如下所示（完成後記得要“修改CustomSetting”和“生成wrap檔案”）。

using UnityEngine;
using System.Collections;
using LuaInterface;
using UnityEngine.UI;
 
public class UIEvent 
{
	//新增監聽
	public static void AddButtonClick(GameObject go, LuaFunction luafunc) 
	{
		if (go == null || luafunc == null) 
			return;
 
		Button btn = go.GetComponent<Button> ();
		if (btn == null)
			return;
 
		btn.onClick.AddListener
		(
			delegate() 
			{
				luafunc.Call(go);
			}
		);
	}
 
	//清除監聽
	public static void ClearButtonClick(GameObject go) 
	{
		if (go == null) 
			return;
		
		Button btn = go.GetComponent<Button> ();
		if (btn == null)
			return;
		
		btn.onClick.RemoveAllListeners();
	}
}

接下來測試下這套API，修改Main.lua，程式碼如下：

--主入口函式。從這裡開始lua邏輯
function Main()					
	略
end
 
--載入完成後的回撥--
function OnLoadFinish(objs)
	--顯示面板
	略
	--事件處理
	local btn = go.transform:FindChild("Button").gameObject
	UIEvent.AddButtonClick(btn, OnClick)
end
 
function OnClick()
	print("觸發按鈕事件")
end

運行遊戲，點選按鈕，OnClick方法即被呼叫。

圖：按鈕的事件響應

讀者可以使用相似的方法監聽其他UI元件，這裡就只演示按鈕事件了。

3、介面管理器

LuaFramework提供了一套簡單的（不完善的）介面管理器，具體程式碼請參見PanelManager類。PanelManager類的CreatePanel方法完成非同步載入資源，在載入完成後，會設定面板的大小和位置，然後呼叫回撥函式。與上面用lua載入介面的方法完全一樣。

圖：PanelManager的CreatePanel方法

LuaFramework會給每個介面新增名為LuaBehaviour的元件，它擁有用於新增按鈕監聽的AddClick方法，相關程式碼如下，與UIEvent的AddButtonClick方法相似。

圖：LuaBehaviour的AddClick方法

在LuaFramework的PureMVC架構中，如果要新增一個介面，需要編寫對應的Controller、View，以及修改3個框架自帶的lua檔案，比較繁瑣。因此在實際專案中有必要重寫PanelManager，由它實現介面的載入及事件處理。