‍

基本UI及运行

这一章我们介绍一个UI系统的实例，包括怎么在UI编辑器里画一个简单的UI界面，将UI资源导入Genesis-3D编辑器工程目录下，编写简单代码运行，UI界面的美化。

1.画一个UI界面。我们这里使用LayoutEditor绘制一个简单的UI界面

（1）添加一个Button：

（2）修改其属性。命名为backgroundButton，同时Layer设置为overlapped（因为这是最底层）：

（3）继续添加一个Button，修改其属性。将name改为startButton：

（4）继续添加一个Button，修改其属性。将name改为helloButton：

（5）完成绘制后点击File—>Save as，用户可设定保存路径，这里我保存在D盘根目录下，重命名为start.layout文件。这里需要注意，重命名时需要加上.layout后缀名：

2.将UI资源导入到Genesis-3D编辑器的工程目录下

（1）新建工程。名称为UI，选择存放工程的位置，由于我们要运行UI界面，所以这里要勾选UIMedia资源包，点击“创建”：

（2）选中“Asset”——>右键点击——>新建——>C#脚本文件，创建出两个脚本文件 UIRoot.cs和StartPanel.cs。UIRoot.cs是基础脚本，StartPanel.cs是控制UI界面的脚本：

（3）保存场景。把它命名为UI：

（4）将之前做好的start.layout复制到UI工程的资源目录下…\GenesisProjects\UI\Asset\UIMedia：

3.编写代码

（1）进入…\GenesisProjects\UI\UserDefCSharp目录，找到代码文件。用MonoDevelop打开，编辑代码：

（2）代码如图所示：

UIRoot.cs代码：

 
       01 
          namespace UserDefGUI 
         
       02 
          { 
         
       03 
              public class UserDefGUIRoot : GUIRoot 
         
       04 
              { 
         
       05 
                  static UserDefGUIRoot _instance = new UserDefGUIRoot(); 
         
       06 
                  static public UserDefGUIRoot Instance 
         
       07 
                  { 
         
       08 
                      get 
         
       09 
                      { 
         
       10 
                          return _instance; 
         
       11 
                      } 
         
       12 
                  } 
         
       13 
            
       14 
                  public override void Init() 
         
       15 
                  { 
         
       16 
                      base.Init(); 
         
       17 
                      LoadLayout(); 
         
       18 
                  } 
         
       19 
            
       20 
                  void LoadLayout() 
         
       21 
                  { 
         
       22 
                      _startPanel.Init(); 
         
       23 
                  } 
         
       24 
            
       25 
                  StartPanel _startPanel = new StartPanel(); 
         
       26 
            
       27 
              } 
         
       28 
          }

StartPanel.cs代码：

 
       01 
          using System; 
         
       02 
          using System.Runtime.CompilerServices; 
         
       03 
          using ScriptRuntime; 
         
       04 
          using ScriptGUI; 
         
       05 
            
       06 
          namespace UserDefGUI 
         
       07 
          { 
         
       08 
              public class StartPanel 
         
       09 
              { 
         
       10 
                  public void Init() 
         
       11 
                  { 
         
       12 
                      GUI.RegisterLayout(_windowName, @"start.layout", false, true); 
         
       13 
                      GUI.SetLayoutVisible(_windowName, true); 
         
       14 
                      GUI.UIWidget.SetVisible(_windowName, "helloButton", false); 
         
       15 
                      GUI.UIWidget.SetEventMouseButtonClick(_windowName, "startButton", StartButtonClick, EventControl.Add); 
         
       16 
                  } 
         
       17 
            
       18 
                  private void StartButtonClick(FString sender) 
         
       19 
                  { 
         
       20 
                      GUI.UIWidget.SetVisible(_windowName, "startButton", false); 
         
       21 
                      GUI.UIWidget.SetVisible(_windowName, "helloButton", true); 
         
       22 
                  } 
         
       23 
            
       24 
                  FString _windowName = "StartPanel"; 
         
       25 
            
       26 
              }; 
         
       27 
          }