:使用 UGUIGenerator 自动生成 UI 代码)
上一篇手动创建并打开了第一个热更界面。这一篇使用UGUIGenerator自动生成成员变量、节点绑定、点击事件和界面注册代码。项目地址https://github.com/ZHOURUIH/MyFramework一、本篇目标创建一个简单的主界面UIMain ├── TitleText ├── StartButton └── CloseButton通过生成器自动完成生成 UIMain.cs 生成成员变量 生成节点绑定 生成按钮点击事件 注册热更界面二、创建 UI Prefab创建UIMain.prefab并保证 Prefab 名称、根节点名称和脚本类名一致PrefabUIMain.prefab 根节点UIMain 脚本类UIMain各节点需要的 UGUI 组件如下节点UGUI 组件生成类型UIMainCanvas、UGUIGeneratorLayoutScriptTitleTextTextmyUGUITextStartButtonImagemyUGUIImageSimpleCloseButtonImagemyUGUIImageSimple按钮节点不需要添加原生Button组件。myUGUIImageSimple配合registeColliderImage可以提供悬停变暗、按下时轻微位移等按钮反馈。三、配置 UGUIGenerator在 Prefab 编辑模式下打开UIMain给根节点添加UGUIGenerator然后把三个节点加入成员列表TitleText - myUGUIText StartButton - myUGUIImageSimple CloseButton - myUGUIImageSimple为StartButton和CloseButton勾选注册点击事件 生成点击回调界面基类使用LayoutScript配置完成后点击生成代码四、生成的界面代码生成结果大致如下using Obfuz; // auto generate member start [ObfuzIgnore(ObfuzScope.TypeName)] public class UIMain : LayoutScript { protected myUGUIText mTitleText; protected myUGUIImageSimple mStartButton; protected myUGUIImageSimple mCloseButton; // auto generate member end public UIMain() { // auto generate constructor start // auto generate constructor end } public override void assignWindow() { // auto generate assignWindow start newObject(out mTitleText, TitleText); newObject(out mStartButton, StartButton); newObject(out mCloseButton, CloseButton); // auto generate assignWindow end } public override void init() { base.init(); // auto generate init start mStartButton.registeColliderImage(onStartButtonClick); mCloseButton.registeColliderImage(onCloseButtonClick); // auto generate init end } public override void onGameState() { base.onGameState(); mTitleText.setText(Hello MyFramework); } //--------------------------------------------------------------------------------------------------------------------------- protected void onStartButtonClick() { // 开始游戏 } protected void onCloseButtonClick() { close(); } }生成器只会更新auto generate标记之间的内容。业务逻辑应该写在自动生成区域外避免重新生成时被覆盖。五、普通点击节点怎么配置如果节点只需要接收点击事件不需要按钮的悬停和按下效果可以使用myUGUIObject并通过下面的方法注册mNode.registeCollider(onNodeClick);如果需要按钮视觉反馈则使用myUGUIImageSimple并注册mButton.registeColliderImage(onButtonClick);本例中的两个按钮需要交互反馈所以使用myUGUIImageSimple。六、自动注册界面生成器会自动更新热更界面注册文件Assets/Scripts/HotFix/UI/LayoutRegisterHotFix.cs生成的注册代码类似public class LayoutRegisterHotFix { public static void registeAll() { // auto generate start registeLayoutUIMain((script) { mUIMain script; }); // auto generate end } }同时还会生成对应的全局引用public static UIMain mUIMain;不需要再手动维护注册代码。七、在 SceneProcedure 中打开界面界面生成并注册完成后在对应流程中加载public class MainSceneLoading : SceneProcedure { protected override void onInit(SceneProcedure lastProcedure) { base.onInit(lastProcedure); LT.LOADUIMain(); } protected override void onExit(SceneProcedure nextProcedure) { base.onExit(nextProcedure); LT.HIDEUIMain(); } }界面操作需要通过LT调用LT.LOADUIMain(); // 加载并显示 LT.SHOWUIMain(); // 显示已加载界面 LT.HIDEUIMain(); // 隐藏但保留实例 LT.UNLOADUIMain(); // 卸载并释放直接写LOADUIMain()在没有额外静态导入时会编译报错。八、推荐开发流程创建新界面时按照下面的顺序操作1. 创建 UI Prefab 2. 添加需要的 UGUI 组件 3. 给根节点添加 UGUIGenerator 4. 配置成员类型和点击事件 5. 点击生成代码 6. 补充界面业务逻辑 7. 在 SceneProcedure 中使用 LT.LOADT() 打开UGUIGenerator负责生成重复代码LayoutScript负责界面内部逻辑SceneProcedure负责决定界面什么时候打开和关闭。