Unity新界面组件UITookit(UIElements)运行时(Runtime)模式试用_unity2019 ui toolkit

原文地址：https://blog.csdn.net/t163361/article/details/104051050
最近准备申请新星创作者，需要2000个粉丝关注，觉得文章有用的，请点一下左侧边栏的关注，谢谢。

文章内容基于Unity2019的UITookit运行时演示版本

前段时间Unity放出了UIElement的运行时模式演示Demo
最近做一个比较简单的界面功能的时候，使用到了运行时模式时有一些个人体会，记录如下：

概述

UITookit(UIelement)本身的基础类是在UnityEngine层面的，所以底层是支持Editor/Runtime双模式的。
之前官方放出的都是Editor下的相关内容，相关教程也都是Editor的。本篇讲的是Runtime模式
由于Runtime还处于早期预览阶段，官方Demo里直接提供的支持运行时的代码，放在Assets/UIERuntime文件夹下。
其中只有Editor，Runtime和USS是有用的，前两个是代码，USS是样式表，可以编辑Default.uss.asset这个文件来设置界面的样式，如图片，字体，颜色号等。

界面创建

界面的创建可以使用UIBuilder，而想要在Runtime下使用就需要创建一个Runtime的渲染对象。
当前提供了一个菜单命令可以快速创建一个界面渲染对象，在Hierarchy里面点击右键，UIElements/Panel就可以快速创建一个界面渲染对象。
渲染对象包含三个组件

• PanelScaler 用来控制界面在GameView中的布局方式
• PanelRender 核心类用来配置界面的布局文件和样式表
  Uxml 设置通过UIBuilder创建出来的uxml文件
  Unity Style Sheet 用来配置上面提到的Default.uss.asset文件
  Enable Live Updates 貌似是支持UIBuiler修改后实时刷新界面的一个开关
• EventSystem 用来响应输入事件

控件使用

控件的使用需要有一个初始化的过程
PanelRenderer组件中有个回调函数postUxmlReload，可以在回调函数里面写初始化的代码，比如官方demo中GameManager.cs的BindMainMenuScreen函数有如下代码

var root = m_MainMenuScreen.visualTree;
var startButton = root.Q<Button>("start-button");
if (startButton != null)
{
     startButton.clickable.clicked += () =>
     {
         StartRound();
     };
 }
1
2
3
4
5
6
7
8
9

这段代码就是先查找对应的按钮控件，然后设置点击的回调函数。

类似的Label可以类比着使用，如下：

		private Label _recordTime;
		
		private IEnumerable<Object> BindTimelineInfo()
        {
            var root = _timelineInfo.visualTree;            
            _recordTime    = root.Q<Label>("RecordTime");
            _recordTime.text = string.Format("T:{0}",DateTime.Now.GetDateTimeFormats('g')[0]);
            return null;
        }
        void UpdateInfo()
		{
			_recordTime.text = string.Format("T:{0}",DateTime.Now.GetDateTimeFormats('g')[0]);
		}
1
2
3
4
5
6
7
8
9
10
11
12
13

这段代码就是初始化的时候查找RecordTime控件，然后在UpdateInfo中触发控件内容的更新操作

技巧

• Default.uss.asset可以自己编辑，但目前官方没给生成工具，可以仿照官方的简化使用。
• 控件的一些属性不是直接可以访问的，需要通过修改style里面的值来访问，例如UIBuilder里面有一项Display可以控制控件是否生效，可以使用如下代码来修改

  _trackInfos[i].style.display = DisplayStyle.Flex;
  1

  其他属性也可以类比着修改

建议和BUG

目前运行时模式配合UIBuilder来使用还是很简单的。不过毕竟是很早期的版本，还有很多功能没有或者有BUG。简单列举如下。
1.目前没看到如何支持粒子特效和3D模型，这就导致作为游戏界面来说很有影响。
2.字体无描边，阴影功能
3.字体的范围计算有问题，当父节点设置为自动适配大小时，范围不对，可以设置绝对大小来暂时避免问题