尝试新的UI工具包示例 – 现在在资产商店可用

在 Unity 2021 LTS 中,UI Toolkit 提供了一系列功能、资源和工具,帮助您在各种游戏应用程序和编辑器扩展上构建和调试自适应运行时 UI。其直观的工作流程使不同角色的 Unity 创作者——艺术家、程序员和设计师——能够尽快开始 UI 开发。
请参阅我们的 早期博客文章,了解 UI Toolkit 的主要优势,例如增强的可扩展性和性能,已经被像 Mechanistry 这样的工作室用于他们的游戏 Timberborn。
虽然 Unity UI 仍然是 3D 世界中定位和照明 UI 或与其他 Unity 系统集成的首选解决方案,但从 Unity 2021 LTS 开始,运行时 UI 的 UI Toolkit 已经可以为寻求性能和可扩展性的游戏制作带来好处。它在屏幕空间 - 覆盖 UI 中特别有效,并且在各种屏幕分辨率上具有良好的缩放性。
这就是为什么我们很高兴宣布两个新的学习资源,以更好地支持使用 UI Toolkit 进行 UI 开发:
- UI Toolkit 示例 - Dragon Crashers:该演示 现在可供免费下载<2>,可从资产商店获取。
- Unity 中的用户界面设计和实现:这本免费的电子书可以从 这里<2>下载。
UI Toolkit 示例演示了您如何利用 UI Toolkit 为自己的应用程序服务。该演示涉及在 2D 项目 Dragon Crashers, 一个迷你 RPG 上的全功能界面,使用 Unity 2021 LTS UI Toolkit 工作流程在运行时。

示例项目中展示的一些操作向您展示如何:
- 在 Unity 样式表 (USS) 文件中使用选择器进行样式设置,并使用 UXML 模板
- 创建自定义控件,例如圆形仪表或选项卡视图
- 自定义滑块和切换按钮等元素的外观
- 使用渲染纹理进行UI覆盖效果、USS动画、季节主题等
在将项目添加到您的素材资源后,尝试输入播放模式。请注意,UI工具包界面不会出现在场景视图中。相反,您可以在游戏视图或UI构建器中查看它们。
左侧的菜单帮助您导航模态主菜单屏幕。这列垂直按钮提供访问五个模态屏幕的权限,这些屏幕构成了主菜单(在切换屏幕时保持活动状态)。
虽然某些互动是可能的,例如通过拖动场景中的可用药水来治疗角色,但游戏玩法保持在最低限度,以确保持续关注UI示例。
让我们仔细看看菜单栏中的UI:
- 主页屏幕在启动应用程序时充当着着陆垫。您可以使用此屏幕来玩游戏或接收模拟聊天消息。

- 角色屏幕涉及游戏对象和UI元素的混合。在这里,您可以探索四个龙崩溃者角色中的每一个。使用统计、技能和生物标签阅读特定角色详细信息,并单击库存槽以添加或删除物品。预览区域显示一个2D照明和绑定的角色,背景为瓷砖状。

- 资源屏幕链接到文档、论坛和其他资源,以充分利用UI工具包。

- 商店屏幕模拟了一个游戏内商店,您可以在其中购买硬币和软币,例如金币或宝石,以及虚拟商品,如治疗药水。商店屏幕中的每个项目都是一个单独的视觉树资产。UI工具包在运行时实例化这些资产;每个资源/游戏数据中的ScriptableObject一个。

- 邮件屏幕是虚构消息的前端阅读器,使用选项卡菜单将收件箱和已删除消息分开。

- 游戏屏幕是龙崩溃者项目的迷你版本,自动开始播放。在这个项目中,您会注意到一些使用UI工具包的修订元素,例如暂停按钮、生命值条,以及在角色受伤时将治疗药水元素拖到角色上的能力。

UI工具包使您能够为整个项目构建稳定且一致的UI。同时,它提供灵活的工具,以添加您自己的设计细节和装饰,以进一步丰富游戏的主题和风格。
让我们回顾一下用于完善示例中UI设计的一些功能:
- 渲染纹理: UI工具包界面在渲染队列中最后渲染,这意味着您无法在UI工具包UI上叠加其他游戏图形。渲染纹理提供了一种解决此限制的方法,使得可以将游戏内效果集成到UI工具包的用户界面中。虽然基于渲染纹理的这些效果应谨慎使用,但您仍然可以在全屏用户界面的上下文中实现清晰的效果,而无需运行游戏玩法。以下图像展示了演示中的多个渲染纹理。

- 主题与主题样式表(TSS):TSS文件是类似于常规USS文件的资产文件。它们作为通过USS选择器以及属性和变量设置定义您自己自定义主题的起点。在演示中,我们复制了默认主题文件并修改了副本以提供季节性变化。

- 自定义UI元素:由于设计师被训练成跳出框框思考,UI工具包为您提供了大量空间来自定义或扩展标准库。演示项目突出了选项卡菜单、滑动切换和下拉列表中的一些自定义构建元素,以及一个径向计数器,以展示UI艺术家与开发人员的能力。

- USS过渡用于动画UI状态变化:为菜单屏幕添加过渡效果可以使您的视觉效果更加精致和平滑。UI 工具包通过 过渡动画 属性使这一过程更加简单,这是 UI 构建器的 检查器 的一部分。调整属性、持续时间、缓动和延迟属性以设置动画。然后只需更改样式,以便 UI 工具包在运行时应用动画过渡。

- 背景模糊的后期处理音量:游戏中一个流行的效果是模糊拥挤的游戏场景,以吸引玩家注意特定的弹出消息或对话窗口。您可以通过在 景深 中启用 音量框架 来实现此效果(在通用渲染管线中可用)。

我们确保使用高效的工作流程来加强用户界面。以下是保持项目良好组织的一些建议:
- 一致的命名约定:采用与您的视觉元素和样式表一致的命名约定非常重要。清晰的命名约定不仅保持了 UI 构建器中层次结构的组织性,还使其对您的团队成员更易于访问,并保持代码的整洁和可读。更具体地说,我们建议使用 块元素修饰符 (BEM) 命名约定来命名视觉元素和样式表。一眼看去,元素的 BEM 命名可以告诉您它的功能、外观以及它与周围其他元素的关系。请参见以下 BEM 命名示例:

- 响应式UI布局:类似于Web技术,UI工具包提供了创建布局的可能性,其中“子”视觉元素适应其“父”视觉元素内部当前可用的大小,以及其他每个元素都有一个锚定到参考点的绝对位置,类似于Unity UI系统。该示例根据需要通过UI的视觉元素使用这两种选项。

- PSD导入器:作为创建演示的最有效工具之一,PSD导入器允许艺术家在主文档中工作,而无需手动单独导出每个精灵。当需要更改时,可以在原始PSD文件中进行更改,并在Unity中自动更新。
- 可脚本化对象:为了专注于UI设计和实现,示例项目使用可脚本化对象模拟后端数据,例如应用内购买和邮件消息。您可以方便地从资源/游戏数据文件夹自定义此替代数据,并使用该示例创建类似的数据资产,如库存项目和UI工具包中的角色或对话数据。

请记住,使用UI工具包时,UI布局和样式与代码解耦。这意味着重写后端数据可以独立于UI设计进行。如果您的开发团队替换这些系统,界面应该继续工作。
演示中使用的其他工具包括使用内置粒子系统创建的粒子系统用于特效,以及2D工具集等。请随时通过检查器查看项目,以了解这些不同元素如何发挥作用。
您可以在UI/Reference下找到由UI艺术家制作的参考艺术,如在UI Builder中复制的那样。整个过程,从模型到线框图,也记录在电子书中。最后,样本中的所有内容都可以添加到您自己的Unity项目中。

