SAO Utils 2（下文略称 “SU2” ）跟之前的 SU 一样可以通过装载扩展来增加新的启动器风格、挂件功能、图标集等内容，SU2 通过支持 QML （一种脚本语言）为扩展的制作降低门槛，提供更加便利的条件
本系列文章旨在让零基础用户知道如何参与 SU2 的扩展制作

已安装的扩展都被存放于 SU2 的本地文件中。可以在 steam 中通过下图方式浏览 SU2 的本地文件



扩展皆存放于 “Packages” 文件夹中



除了 “.swap” 之外，其他都是存放各个扩展的文件夹，可以直接查看对应扩展包含的文件
此处扩展的文件夹命名限制：不允许除了 英文字母、数字、“ . ”、“ - ” 之外的其他字符



此外还可以通过下图方式在 SU2 的首选项（可右键任务栏处 SU2 的托盘图标打开，或在启动器中寻找该选项）中查看特定拓展的文件




接下来以 “HP 计量表挂件扩展” 为例进行说明，以下是 HP 计量表挂件扩展（com.gpbeta.widget.hp-bar）包含的文件



“package.json” 它是扩展的描述文件，是所有拓展的起点，要了解扩展是如何运作的那就从这个文件起步
“Images” 储存了扩展需要用到的图片资源
“Locales” 储存了扩展的多语言文件，扩展需要对不同地区用户显示不同的语言时需要该类文件（不包括 package.json 中多语言版本的说明，即首选项中扩展详情的说明内容）
“Presets” 储存的是下图挂件库（可右键 SU2 的托盘图标开启）中的预置挂件的配置文件



“qml” 储存的是 QML 文件（后缀是 .qml），QML 是一种脚本语言。拓展中的 QML 文件说明了扩展的实现逻辑，在了解掌握 QML 的情况下，你可以轻松地学会制作 SU2 的扩展。

在制作扩展的时候需要查看 JSON、QML、XML 等代码文件，这些代码文件编写的语言格式各有差别，推荐使用 Visual Studio Code（下文简称 VS Code）等源代码编辑器来方便查看，使用VS Code 的话可以通过下图方式搜索 “中文简体“ 找到由微软（Microsoft）发布的中文简体语言包拓展，具体使用方式请查看扩展的详请界面



之后也需要通过相同方式搜索 “json”、“qml”、“xml” 安装对应的扩展来提升后续的效率与体验。一般而言安装搜索结果中下载数最多的拓展即可



利用这些扩展可以更容易地看懂代码的结构，源代码编辑器还有字段补全等功能方便代码的编写与修改
下图就是使用记事本与 VS Code 查看同一文件的对比

前文已经提到过 package.json 是一切扩展的起点，扩展的代码也都是可以直接查看的，可以从这个起步逐渐了解一个扩展是如何运作的。学会理解、模仿、加入自己的东西，你也可以自行制作 SU2 的扩展
扩展的大部分内容由 QML 文件阐述，学会使用 QML 是学会制作扩展重要部分。QML作为发展多年的脚本语言，已经有完善的官方文档供开发者参考（https://doc.qt.io/qt-5/qmltypes.html）。虽然文档是英文版本的，但是可以利用翻译工具辅助理解。目前会用到 QML 的领域也不止是 SU2 ，灵活使用搜索引擎可以收获来自更多开发者的经验，虽然用途不同，但是方法是相通的。
在制作扩展的过程中需要多次在 SU2 中查看扩展是否正常运作以及效果，如下图所示在首选项开启开发者模式与日志窗口，可以在扩展不正常运作时查看是否有报错信息，利用报错信息来完善扩展。在显示日志窗口的情况下若 SU2 无响应，需要在日志窗口中按下回车键。（这是为了让开发者不错过部分报错信息的设定，因此在日常使用中不建议显示日志窗口）

在完成扩展制作后，可以右键任务栏处 SU2 的托盘图标，点击 “创意工坊”



在 “我的工坊” 中点击右下角的加号即可创建新的工坊物品



之后点击该物品，点击 “导入扩展包”，之后按照提示点击并输入信息，完成后点击发布
如果你之前从未在创意工坊发布过公开物品，需要同意《Steam 订户协议》才能将你的创意工坊物品设为公开状态让他人订阅使用
如下图或其他方式（如 社区-创意工坊）进入Steam的创意工坊页面




一般而言界面会有明显的提示方便你同意《Steam 订户协议》，根据提示在阅读协议全文并同意协议内容的基础上点击同意后，就可以将你的扩展设为公开状态，为SU2的社区添砖加瓦

首先在 SAO Utils 2（后文称 SU ）的本地文件的 Packages（扩展）文件夹中新建一个文件夹
文件夹的命名需要符合以下格式：



只能用小写英文字母及数字、“.”（英文句号）、“-”（短横杠）

在本节作为例子将新文件夹命名为：com.liyropen.icon.ff14-job
（实际操作时请根据自身情况及需求进行命名）



之后进入该文件夹新建一个 "icon" 文件夹将所需要的图标图片放入这个文件夹中



图片一般为PNG文件，软件中图标的显示面积偏小，建议使用构图偏简单的图片，图片的像素大小也不要过大

如下图所示，右侧 SU 中图标的选取界面跟左侧的文件夹管理器类似，图标选取界面会直接显示文件名称和文件夹，可以在文件管理器中通过文件夹实现图标集的内部分类



接下来打开 Visual Studio Code 等前文提到的同类软件，新建文本文件选择 JSON 语言
保存该文件，命名为 "package.json"，保存在 "com.liyropen.icon.ff14-job"（也就是扩展的根目录）
"package.json" 是扩展的描述文件，它包含了扩展的基础信息
此处对没用过 Visual Studio Code 此类软件的读者进行说明，软件根据使用的文本语言会提供便利的格式功能，下面就是其中一例
首先键入
将鼠标移至中括号中间



按回车，软件会自动进行格式调整



鼠标移至左侧的行数栏可以看到下图红框标出的小箭头，可以点击以此检查代码结构的包含关系



在第 2 行即中括号中键入
此时软件中应显示为
第 2 行定义了一个值，冒号前的是值的名字，冒号后的是值的内容。“name” 是扩展的标识，在下图 SU 的扩展的详情界面中可以看到



标识是 SU 识别扩展的途径，应当跟扩展所处的文件夹名称一致，所以在冒号后的引号中键入扩展所处文件夹的名字
在这一行最后键入 ","（英文逗号）按回车另起一行键入
软件中应显示为
中括号是一个集合，中括号中一个个值的集合，而逗号就是用来分隔单个集合中值与值之间的符号。你也可以看到整个文件都被一组中括号包含着，这个文件本身就是一个集合
"version" 是扩展的版本
继续按照前文的方法键入新的值
"title" 是扩展的标题
值的内容中也是能使用集合的，在此处使用集合是因为 SU 支持多语言。在 "version" 集合中键入简体中文的相关值
"zh" 的值是用户设置 SU 的语言为简体中文时显示的扩展标题内容



如果需要支持其他语言可以继续键入相关内容。关于语言对应值的名字，可以在网络上搜索 ”语言代码“ 进行了解
在 "title" 之后（实际上顺序没有所谓） 键入 ”description“（描述）的集合



键入 "homepage"（网站）、 "bugs"（Bug 反馈）、 "author"（作者）的值及其相关内容（不存在或者不想写的话可以不写，本教程的代码纯作为例子使用）



键入 "resources"（资源）的值
"resources" 包含的值是扩展内资源的说明。” [ ] “（方括号）是比 " { } "（中括号）更大一级的集合符号，因为一个扩展中可能包含多个资源，而此处单个资源的说明就需要一个包含多个值的集合，所以需要一个更大的集合
"location" 是资源的应用位置，图标类的值为 "/icons"
"catalog" 是资源的类型，图标类的值为 “icon”。图标类是有子分类的，适用于浅色主题的是 “light”，适用于深色主题的是 “light”，除此之外的是 "color"。如果图标不倾向于浅色 \ 深色主题的话，"catalog" 的值就是 "icon/color"



"title" 是图标集的名称，跟前文的 "title" 同样支持多语言



"entry" 的值是扩展提供给 SU 的实际内容的文件路径。在本节中的图标集类型的拓展就会通过这个值，将图标的图片文件所在路径提供给 SU。在 "entry" 等值的内容为文件路径的情况下，以上面的示例代码为例，"./icon" 其中的 "."（英文句号）代表的是拓展的根目录，在本节的范例中就是 "com.liyropen.icon.ff14-job" 文件夹，那么 "./icon" 指向的就是 "com.liyropen.icon.ff14-job/icon"

在 "package.json" 文件中配置好这些值后，图标集的制作就完成了。打开 SU 进行测试扩展是否正常工作，如果已经打开了 SU，需要关闭 SU 后再重新启动 SU
右键任务栏中 SU 的托盘图标点击 “首选项”，选择 “扩展”，找到先前制作的扩展，如果如下图所示开关为灰色的话，点击它将该扩展启用。之后就可以通过定制启动器的项目、编辑 HUD 挂件的项目等途径打开图标选取界面，检查扩展是否正常运作

一切正常的情况下，就可以将该扩展上传到 Steam 的创意工坊了
右键任务栏中 SU 的托盘图标点击 “创意工坊”



点击 “我的工坊”，点击右下角的加号按钮



点击 “导入扩展包”

点击封面图片选择展示在创意工坊的封面图，请遵循 “封面图片” 文字下行的要求

依次点击 “标题”、“描述” 填入相关内容

点击 “资源目录”，选择扩展的根目录，也就是 "package.json" 文件所在的文件夹
下图左侧是 SU 选择 “资源目录” 的界面，右侧是文件管理器显示的相同路径下的文件情况，注意红框的 "package.json" 文件，要在左侧的界面中选择 "package.json" 文件所在的文件夹



之后点击 “发布”，等待片刻即可
如果是初次上传工坊物品，会提示需要同意《Steam 订户协议》，点击相关链接后，在理解并接受《Steam 订户协议》内容的情况下根据网页引导同意之后，才能将该物品设为公开状态让他人订阅使用
点击 “在 STEAM 上查看”，可以在外部浏览器打开这个扩展在创意工坊的链接
在外部浏览器没登陆 Steam 账户的情况下，显示该工坊物品处于非公开状态下是正常的，登录后就查看该物品的详情
在上传新的工坊物品，可能会受到来自 Steam 的自动内容审查，等待数分钟即可



你也可以在 Steam 客户端内通过下图方法找到你在创意工坊提交的物品




除了创意工坊之外，还可以通过直接分享扩展文件，让他人从更多的渠道来使用你制作的扩展
比如说使用解压缩软件来将整个扩展的文件夹压缩成压缩文件，之后利用其他方法来传播这个压缩文件供他人使用
其他用户只要获得到压缩文件后，跟你一样将其解压并置于 SU 安装目录的 "Packages" 文件夹后，重新启动 SU 就可以在首选项的扩展页看到你制作的扩展了
下图就是一般情况下扩展压缩文件的内部文件展示