【Unity 实用工具篇】| UX Tool 工具 快速上手使用，提高日常开发效率

呆呆敲代码的小Y2026-01-05 8:53
  • [【Unity 实用工具篇】| UX Tool 工具 快速上手使用，提高日常开发效率](#【Unity 实用工具篇】| UX Tool 工具 快速上手使用，提高日常开发效率)
    • [一、UX Tool 工具](#一、UX Tool 工具)
      • [1.1 介绍](#1.1 介绍)
      • [1.2 使用说明及下载](#1.2 使用说明及下载)
      • [1.3 安装指南](#1.3 安装指南)
        • [1.3.1 InputSystem 安装](#1.3.1 InputSystem 安装)
        • [1.3.2 DOTween 安装](#1.3.2 DOTween 安装)
        • [1.3.3 导入UXTool工具包](#1.3.3 导入UXTool工具包)
    • 二、使用教程，实用功能介绍
      • [2.1 工具面板](#2.1 工具面板)
      • [2.2 布局工具](#2.2 布局工具)
      • [2.3 组件库](#2.3 组件库)
        • [2.3.1 使用路径](#2.3.1 使用路径)
        • [2.3.2 创建组件](#2.3.2 创建组件)
        • [2.3.3 管理组件](#2.3.3 管理组件)
      • [2.4 其他功能](#2.4 其他功能)
  • 总结

前言

  • 在日常生活中，无论做什么事情，效率肯定是很重要的一环。
  • 而在游戏开发过程中，提高工作效率自然也是很重要的。
  • 今天来分享一个Unity中可以提高开发效率的工具UX Tool，一起来看下吧！

【Unity 实用工具篇】| UX Tool 工具 快速上手使用，提高日常开发效率

一、UX Tool 工具

1.1 介绍

UX Tool 是网易雷火发布的一个Unity插件，旗下的《永劫无间手游》也是用到了这个工具中的一些功能。

面向开发者的界面开发解决方案，集界面拼接、层级管理、组件整合等功能于一体，

帮助开发者快速上手界面拼接开发工作，助力项目在多平台、多语言发行上快速达成目标。

特点：

  • 支持多语种本地化
    全面支持全球主流语种，一种工具，多种语言
    本地化工作是游戏出海面对的巨大挑战之一，也是影响出海成败的关键因素。ThunderFire UX Tool从文本、图素、阅读规则等多角度出发，全面支持游戏产品的多语种本地化。
  • 界面搭建低代码化
    让设计师像使用设计软件一样流畅上手拼接工作
    Unity本身的界面搭建规则主要面向程序员，对设计师有一定门槛。ThunderFire UX Tool从设计师角度出发，还原设计软件常用操作，简化拼接流程，降低对程序的依赖性，帮助非程序背景的设计师轻松上手并完成界面拼接工作。
  • 通用游戏功能封装
    拒绝重复造轮子，即接即用，提升开发效率
    ThunderFire UX Tool从游戏通用功能出发，通过将红点系统、新手引导、色盲模式等常用模块进行封装，打包提供给开发者，无论大中小规模项目都能快速适配，大幅提升开发效率。
  • 支持更多输入端
    提供键鼠、手势、手柄等一应俱全的输入支持
    ThunderFire UX Tool支持多种游戏输入形式。除了常规的键鼠和手势触摸外，还基于合作项目的主机端发行经验，开发了一套适配性和易用性更强的手柄引导解决方案。

1.2 使用说明及下载

1.3 安装指南

ThunderFire UX Tool 目前支持 2019、2020、2021的Unity 版本。（已在以上LTS版本进行过测试验证）

ThunderFire UX Tool 相关功能依赖 InputSystem 和 DOTween，因此在导入 ThunderFire UX Tool 工具包前需要先安装 InputSystem 和 DOTween。

1.3.1 InputSystem 安装

在菜单栏【Window->Package Manager】中安装 Input System。

1.3.2 DOTween 安装

DOTween 需要去官网下载，官网地址：http://dotween.demigiant.com/download.php

下载完成后导入 Assets 中即可。

1.3.3 导入UXTool工具包

点击菜单栏【Assets->Import Package->Custom Package...】，选择 uxtools.unitypackage，导入即可开始使用。

如果安装出现问题可查看官方更多描述：用户手册-安装指南

二、使用教程，实用功能介绍

提示：本文内容会从使用者的角度出发，介绍该工具的一些实用功能，方便感兴趣的小伙伴可以快速了解该工具，若是想了解更详细的功能文档可前往官方文档查看。

2.1 工具面板

ToolBar是用于进行快速拼接界面的辅助工具栏，位于Scene面板底部，通过Unity顶栏【ThunderFireUXTool-工具栏 (ToolBar)】可进行启用或关闭。

底部面板功能，从左往右依次：

  • 背景图：在场景或Prefab中创建背景参考图，从而在参考图基础上进行界面制作。
  • 最近打开：打开最近打开面板，查看最近打开过的Prefab。
  • 预览：在Game面板中预览当前打开的Prefab。
  • 文本：在场景或Prefab中创建UXText对象，通过拖拽直接绘制UXText的选框。
  • 图片：在场景或Prefab中创建UXImage对象，通过拖拽直接绘制UXImage的选框。
  • 参考线：在场景或Prefab中创建一组参考辅助线。
  • 组件库：打开组件库面板，查看所有组件。
  • 新建组件：将当前选中的节点或Prefab作为组件收纳在组件库中。
  • 更多：打开工具信息面板或设置面板。

这里比较常用的功能是参考线、组件库及更多。

  • 参考线 一般在项目中按自己的需求添加过一次就好了，可以随时调整参考线的位置。
  • 组件库 则是在制作UI面板的时候要经常使用，点击这个按钮就会打开组件库的面板，从组件库中找到提前设置的组件直接拖到面板上使用即可。
  • 更多 则是对该工具的一些设置，包括一些功能的开启等。

2.2 布局工具

UX Tool提供了基础的UI布局工具，帮助设计师在Scene中进行快速高效的界面拼接。 布局工具可在【ThunderFireUXTool-设置 (Setting)-功能开关】中选择开启或关闭。

对齐与排列工具位于Inspector面板、Rect Transform组件下，提供左对齐、水平居中对齐、右对齐、顶对齐、垂直居中对齐、底对齐共6种对齐方式，以及竖向分布和横向分布共2种分布方式。

使用该工具可以实现多个对象的快速布局，提高拼接效率和准确性。

2.3 组件库

ThunderFire UX Tool中的组件库是将用户常用的Prefab以组件的形式收纳、分类和管理的工具。

组件是指设计师在Unity中进行界面拼接时创建的，具有通用性和复用性的Prefab。例如在多个界面中重复出现的按钮控件，作为组件存储后，便可以方便快速地多次使用。

组件库用来将各种组件进行分类收纳，帮助用户更加方便地管理所创建的组件。

2.3.1 使用路径

1.通过ToolBar打开 通过Unity顶部下拉菜单【ThunderFireUXTool-工具栏 (ToolBar)】启用ToolBar，然后点击ToolBar上的组件库按钮，即可打开组件库面板。

2.通过顶部下拉菜单打开 点击Unity顶部下拉菜单【ThunderFireUXTool-组件库 (Widget Repository)】，也可打开组件库面板。

2.3.2 创建组件

组件的创建方式有三种。任意Prefab或非Prefab的节点均可以被创建为组件。

1.通过ToolBar创建 通过Unity顶部下拉菜单【ThunderFireUXTool-工具栏 (ToolBar)】启用ToolBar，选中Scene中的Prefab或节点后，点击ToolBar上的【新建组件按钮】，会弹出新建组件弹窗，填写信息后即创建完成。

2.通过拖拽创建 打开组件库面板，直接从Hierarchy或Project【拖拽】Prefab或节点至组件库面板，会弹出新建组件弹窗，填写信息后即创建完成。

3.通过右键创建 在Project中选择Prefab右键点击【设置为组件(Set As UXWidget)】，会弹出新建组件弹窗，填写信息后即创建完成。

2.3.3 管理组件

组件以缩略图的形式展示在组件库中，双击可直接打开组件对应的Prefab。

在组件库中右键点击组件可修改组件属性，包括组件名称、组件类型、组件存储位置和组件生成模式。

  • 组件名称：即组件所对应的Prefab的名称，修改组件名称，该Prefab名称也会随之改变。
  • 组件类型：即组件在组件库中的分类，默认为"全部"，通过拖拽创建组件时会自动识别当前分类。除了在组件库面板中新- 建组件类型外，在组件信息中，点击组件类型下拉列表中的"+"号，也可创建新的类型。
  • 组件储存位置：即组件所对应的Prefab在项目中的位置，设置一次后无法再次修改。
  • 组件生成模式：
    • Prefab：即组件以Prefab的形式添加到场景或Prefab中。
    • Unpack Prefab：即组件与Prefab解绑后，直接以普通节点的形式添加到场景或Prefab中。

在组件库中右键点击组件可删除组件，可选择仅在组件库列表中删除，或同时删除对应的Prefab本地文件。

组件库这块比较重要，所以把相关使用方法都做了介绍。

已创建的组件可以在场景或Prefab中使用，打开组件库面板，直接将对应组件拖拽到Scene面板中即可生成。

项目中都会存在一些通用性的模版或资源，比如通用奖励道具、通用弹窗、通用按钮等等。

这个时候把这些通用资源放到组件库中，在后续有相关功能时就可以直接从组件库中使用，减少了无意义的重复劳动。

2.4 其他功能

除了上面说的之外，UXTool还提供了几个组件：UXText、UXImage和UXScrollView，以及新手引导、本地化功能、红点功能等功能。

对其他功能感兴趣的可以去官方文档中查阅具体示例和实现方法。

总结

  • 起初使用该工具的目的是为了用它的组件库，将通用的组件封装到组件库之后就可以快速使用并迭代了。
  • 还有它的布局工具也可以让开发者在拼接UI界面时可以提高效率且位置坐标等更加精准。
  • 该工具还提供了新手引导、本地化、红点等功能，对于轻量项目来说可以拿来直接使用，省去一部分开发时间。
  • 本文提供了个人认为比较常用的部分功能介绍，如需更全面的教程可以前往官方文档查阅。

  • 🎬 博客主页：https://xiaoy.blog.csdn.net

  • 🎥 本文由 呆呆敲代码的小Y 原创 🙉

  • 🎄 学习专栏推荐：Unity系统学习专栏

  • 🌲 游戏制作专栏推荐：游戏制作

  • 🌲Unity实战100例专栏推荐：Unity 实战100例 教程

  • 🏅 欢迎点赞 👍 收藏 ⭐留言 📝 如有错误敬请指正！

  • 📆 未来很长，值得我们全力奔赴更美好的生活✨

  • ------------------❤️分割线❤️-------------------------

相关推荐
世洋Blog14 小时前
Unity开发微信小程序-避开新InputSystem有关坑
unity·微信小程序
skywalk81631 天前
wow文件处理trinitycore的文件处理
开发语言·游戏
youngee111 天前
hot100-64跳跃游戏
算法·游戏
简简单单OnlineZuozuo1 天前
提示架构：设计可靠、确定性的AI系统
人工智能·unity·架构·游戏引擎·基准测试·the stanford ai·儿童
CodeCaptain1 天前
CocosCreator3.8.x 解析Tiled1.4.x【瓦片图层、对象图层、图像图层、组图层】的核心原理
经验分享·游戏·typescript·cocos2d
郝学胜-神的一滴1 天前
OpenGL纹理技术详解：从原理到实践
c++·程序人生·游戏程序·图形渲染·贴图
mg6681 天前
0基础开发学习python工具_____用 Python 从零写一个贪吃蛇游戏：完整实现 + 打包成 .exe（附源码）
python·游戏·pygame·python开发
CodeCaptain1 天前
Cocos Creator 3.8.x 读取 Tiled 1.4.x 原理分析
经验分享·游戏
littleschemer2 天前
go结构体扫描
游戏·go·解析·struct
热门推荐
01GitHub 镜像站点02手把手教你通过Gemini3 pro 学生认证，白用一年，手慢无！03安娜的档案(Anna’s Archive) 镜像网站/国内最新可访问入口（持续更新）04Linux下V2Ray安装配置指南05jdk21下载、安装（Windows、Linux、macOS）06Labelme从安装到标注：零基础完整指南07GitLab 零基础入门指南：从安装到项目管理全流程082025 最新教程：注册并切换到美区 Apple ID09Figma MCP + Cursor 完全配置与使用指南：实现设计到代码的智能转换10【踩坑笔记】50系显卡适配的 PyTorch 安装