- 查看: 416
- 回复： 1
Server UI 教程
做一个由 SAPI 制作的游戏内UI！
前言
做一个由 SAPI 制作的游戏内UI！
前言
Server UI 是 Script API 中的一个库，可以在游戏里创建菜单、表单等 UI。它的出现使 Script API 变得更加有创造性，你可以将此功能用到 Script API 的各种地方，例如雪球（时钟）菜单、触发事件的自定义组件或其他。本教程将告诉大家什么是 ActionFormData、MessageFormData 与 ModalFormData 以及它们的使用方法。本人对 Script API 并不过于全知，所以可能会有遗漏，欢迎进行提醒。
如何使用 Server UI
第一个问题来了，我们怎么来使用 Script API 以及 Server UI库呢？
打开行为包文件夹，打开附加包清单文件 manifest.json ，在 modules 数组以下，添加 dependencies 数组，dependencies 这样写：
代码：
"dependencies": [
{
"module_name": "@minecraft/server",
"version": "xxx"
},
{
"module_name": "@minecraft/server-ui",
"version": "xxx"
}
]module_name 是库的名字，version 是库的版本，@minecraft/server-ui 就是 Server UI 的库名。截止到目前，@minecraft/server 的最新版本是1.15.0，@minecraft/server-ui 的最新版本是 1.3.0。若想要查看这两个库名的最新版本，可以去
Contains many types related to manipulating a Minecraft world, including entities, blocks, dimensions, and more.. Latest version: 1.16.0, last published: a month ago. Start using @minecraft/server in your project by running `npm i @minecraft/server`. There are 61 other projects in the npm...
www.npmjs.com
完整的清单文件是这样的：
代码：
{
"format_version": 2,
"header": {
"name": "名称",
"description": "介绍",
"uuid": "自行填写",
"version": [
0,
0,
1
],
"min_engine_version": [
x,
x,
x
]
},
"modules": [
{
"type": "script",
"language": "javascript",
"uuid": "自行填写",
"entry": "scripts/xxx.js",//自行选择xxx部分
"version": [
0,
0,
1
]
}
],
"dependencies": [
{
"module_name": "@minecraft/server",
"version": "1.15.0"
},
{
"module_name": "@minecraft/server-ui",
"version": "1.3.0"
}
]
}在行为包的 script 文件夹，在JS文件中写入
代码：
import { ActionFormData, MessageFormData, ModalFormData } from "@minecraft/server-ui"接下来将讲解三个 UI 是什么，不再赘述 Script API 其他内容。
ActionFormData
此 UI 相当于一个菜单
写法：
代码：
function Functionname(player) {
const Test = new ActionFormData()
.title(``)
.body(``)
.button(``)
.button(``)
.button(``)
.show(player)
.then((Test) => {
})
}代码讲解
▪const Test = new ActionFormData() 此代码是创建 ActionFormData UI 的语句，Test 是这个 ActionFormData 对象的名字，可替换为其他名字。
▪.title(``) 菜单最上面的标题，可见上方图例。
▪.body(``) 菜单中靠上的简介部分，可见上方图例。
▪.button(``) 菜单的按钮部分，可见上方图例。还可以写为 .button(``, `textures/...`)，后者资源包的 textures 图片路径指定按钮左旁的图片。可多个添加。
▪
.show(player)
.then((Test) => {
}
展现给玩家的语句，在里面括号里写入当点击按钮时会发生什么。这里使用IF语句
里面的其他函数以及其他的这是当点击按钮1时会执行的，如果 Test.selection 为1，就是第2个按钮点击后发生的。以此类推。
可以执行另一个 UI 函数，也可以执行命令。使用 player.runCommand，比如：
代码：
player.runCommand(`effect ${player.nameTag} instant_health 99999 255 true`)ModalFormData
相当于一个表单，里面内含输入框、下拉栏、滑动栏、拉杆。
写法：
代码：
function Functionname(player) {
const Test = new ModalFormData()
.title(``)
.textField(``,``)
.toggle(``,true)
.dropdown(``,[``,``,``,``],0)
.slider(``,0,64,1,32)//不要在意这些数字
.show(player)
.then((Test) => {
if (xxx.formValues[0] == xxx) {
...
} else {
...
}
})
}代码讲解
▪.textField(``,``) 输入框，前者反引号为输入框上面的输入文字，后者为输入框里面的提醒文字。
▪.toggle(``,true) 前者反引号是拉杆选项是文字，后者布尔值是默认为开还是关。true 是默认为打开，false 是默认不打开。
▪.dropdown(``,[``,``,``,``],0) 下拉栏，前者反引号是下拉栏说明，中间的数组下拉栏内容，也是用反引号为一个，内容直接用英文逗号隔开。最后的数字是下拉栏默认的内容，0 是 第一个，1 是 第二个，以此类推。
▪.slider(``,,,,) 滑动条，这样写：
.slider(`滑动条名字`,最小值,最大值,分度值,默认值)
分度值是每次滑动一次时会滑动多少。比如最大值为10，分度值为2，每次滑动数值都会滑动±2，从开头/结尾滑动5次就会拉到头。默认值是设置滑动条的默认数值。 如何获取表单内容进行判断：如果有的表单内容需要判断，要获取一个部分的值并判断，写为以下代码
if (Test.formValues[0] == xxx) {
...
} else {
...
}
Test.formValues[0] == xxx 是索引值为某一数值、字符串或布尔值的判断部分。当点击提交，就会安装IF语句里执行其他内容。
MessageFormData
此 UI 相当于一个弹窗。
写法
代码：
function Functionname(player) {
const Test = new MessageFormData()
.title(`标题`)
.body(``)
.button(``)
.button(``)
.show(player)
.then((Test) => {
if (Test.selection == 0) {
...
}
if (Test.selection == 1) {
...
}
})
}弹窗有两个按钮，当点击第一个按钮后执行第一个IF语句内容，第二个同理。
▪.body(``) 弹窗内容
结尾
本帖是原作者本人从隔壁论坛搬来的，因为不大熟悉 MineBBS 的 BBCode，再加上要与本论坛相结合，搬运效果不如原帖。愿大家创造出自己的作品～
- 内容版权许可
- CC BY-NC-SA 署名-非商业性使用-相同方式共享
