Verse Commander Minigame имеет следующий интерфейс:
Команды персонажа: эти кнопки сопоставляются с командами для NPC («Вперёд», «Повернуть направо», «Повернуть налево»). Любая из этих команд при выборе добавляется в список внизу экрана.
Выполнить: кнопка «Выполнить», приказывающая NPC поочерёдно выполнить команды, показанные внизу экрана.
Удалить: кнопка «Удалить», удаляющая последнюю команду, добавленную в список.
Сброс: кнопка «Сброс», которая сбрасывает текущую доску и очищает очередь команд.
Список команд: динамический список команд, который пополняется по мере добавления игроком команд и уменьшается при их удалении.
Интерфейс полностью реализован на Verse. Изучите раздел Создание внутриигровых пользовательских интерфейсов, чтобы начать создавать интерфейсы на Verse и понимать принцип их работы.
В разделах ниже вы узнаете, как создавать пользовательские кнопки и динамический интерфейс в этой игре.
Создание кнопок
Кнопки создаются в собственном классе — minigame_button, — который отвечает за их внешний вид в момент активации или деактивации. Мы использовали кнопку без звука, которая накладывается на горизонтальное стековое поле с текстом и значком, которое, в свою очередь, накладывается на фон. При этом кнопки получат индивидуальное оформление с теми же функциями и откликом, которыми обладает стандартная кнопка в Fortnite.
Функция SetEnabled() сама подберёт свойства взаимодействия кнопки и будет менять текстуру и цвета в зависимости от состояния кнопки.
# The class for storing all the widget references for a button and setting its look.
minigame_button := class:
# Store a reference of the overlay for easy removal later.
var Widget:overlay = overlay:
# Store a reference of the background texture widget to change easily later.
BackgroundImage:texture_block = texture_block:
DefaultImage := Textures.MiniGameUI.T_UI_Button_Blue_Rounded
DefaultDesiredSize := vector2{X := 256.0, Y := 128.0}
Добавление команд на экран
Каждая ячейка списка команд внизу сохраняется в экземпляре класса command_queue. Этот класс отвечает за вид ячейки и хранит любые данные команд, которые с ней связаны.
Всегда доступны две ячейки, даже при отсутствии команд в списке, которые представляют левый и правый конец отображаемого списка. Когда игрок выбирает новую команду, правый конец обновляется со значком команды и в правый конец добавляется новая ячейка. Затем представление данных команды сохраняется в переменной CommandData.
Когда игрок выбирает кнопку удаления, виджет в правом конце удаляется из рабочей области и последняя команда меняется на ячейку в правом конце. Для переменной CommandData устанавливается значение false, так как с этой ячейкой больше нет связанных команд.
# A class that stores the image (texture) that is used to represent a command in the queue on screen
# and the enum associated with that command.
command_queue := class:
# Store a reference of the overlay for easy removal later.
var Widget:overlay = overlay{}
# Store a reference of the background texture block to change the image easily later.
BackgroundImage:texture_block = texture_block:
DefaultImage := Textures.MiniGameUI.TransparentImage512
DefaultDesiredSize := vector2{X := 88.0, Y := 88.0}
Общее управление интерфейсом
Большая часть кода для интерфейса содержится в классе verse_commander_minigame_ui. Этот класс отвечает за оформление каждой кнопки и её конкретный текст и значки, генерирует макет интерфейса и обрабатывает изменения при добавлении или удалении команд.
Пользовательские изображения являются текстурами, которые доступны в Verse из UEFN. Уровень доступа для текстур, импортированных в проект, определяется в файле submodules.verse. Более подробно об этом рассказывается в разделе Доступ к ресурсам для Verse.
Этот код длиннее, чем в некоторых других файлах, потому что в нём нужно указать положение и внешний вид каждого виджета в интерфейсе. Большая часть поведения заключена в трёх функциях: ResetCommandQueue(), Remove() и AddCommandToDisplay().
# This file contains all the code to create and modify the UI
# in the Verse Commander minigame.
# The UI for the game contains:
# - Buttons that map to commands for the NPC: forward, turn left, turn right.
# - An execute button that tells the NPC to perform the queue of commands.
# - A remove button that removes the last command added.
# - A reset button that resets the current board and clears out the command queue.
# - A dynamic list of commands that grows wider when a player adds commands and shrinks when a player removes commands.
using { /Fortnite.com/Devices }
Следующий шаг
Полный код для создания интерфейса приведён в последнем шаге 7. Окончательный результат.
Итак, у нас есть пользовательский интерфейс. В следующем шаге давайте разберём, как управлять игрой и всеми созданными элементами.
