Размещение виджетов на экране в Unreal Editor для Fortnite | Fortnite Документация

Виджеты размещаются на экране с помощью виджета рабочей области, при этом они добавляются в ячейки рабочей области.

Кнопка с текстом «Центр» в середине экрана

Следующий код содержит пример виджета рабочей области, который отображает текст «Центр» на кнопке в середине экрана.

Verse

using { /Fortnite.com/Devices }
using { /Verse.org/Simulation }
using { /UnrealEngine.com/Temporary/UI }
using { /Fortnite.com/UI }
using { /UnrealEngine.com/Temporary/SpatialMath}

hello_world_device := class(creative_device):

    # Set the Button device in the Editor to reference the device in the level
    @editable

Настройки ячейки рабочей области

Вы можете изменить следующие поля ячейки рабочей области для размещения виджетов в рабочей области:

Поле	Описание	Значения
Ориентиры	Место в рабочей области, к которому привязывается виджет; указывается в процентах рабочей области. Когда размер рабочей области изменяется, виджет остаётся прикреплённым к своим точкам привязки в рабочей области нового размера. Вы можете указать максимальную и минимальную точки привязки виджета, которые могут изменять его размер, когда включена настройка SizeToContent.	Диапазон полей X и Y точки привязки составляет от 0 до 1, где `vector2{X := 0.0, Y := 0.0}` является левой верхней частью рабочей области, а `vector2{X := 1.0, Y := 1.0}` — правой нижней частью.
Выравнивание	Часть виджета, которая находится в точке привязки. Например, если для поля Alignment выбран `vector2{X := 0.5, 1.0}`, центр нижней части виджета располагается в точке привязки.	Диапазон полей X и Y для поля Alignment составляет от 0 до 1, где `vector2{X := 0.0, Y := 0.0}` является левой верхней частью виджета, а `vector2{X := 1.0, Y := 1.0}` — правой нижней частью.
Смещения	Это поле может влиять на размер и положение виджета двумя способами: Когда заданы значения обоих полей Anchors и Alignment, в этом поле можно указать смещение положения виджета относительно точки привязки. Когда виджет привязан таким образом, что размер является недопустимым, это поле может представлять размер пространства, выделенного для виджета. Однако если настройка SizeToContent включена, виджет примет необходимый размер.	Поля должны находиться в диапазоне от 0 до 1080. Это разрешение масштабируется в соответствии с разрешением экрана игрока.
SizeToContent	Если включено, размер виджета устанавливается по желанию.	`true` / `false`, чтобы указать, включена настройка или нет.

Расположение и компоновка элементов интерфейса зависят от платформы. Разрешение и размер интерфейса будут определяться платформой, которую использует игрок.

Как правило, процесс размещения виджета заключается в настройке полей в следующем порядке:

Anchors, чтобы указать, где виджет должен отображаться в рабочей области (даже при изменении её размера).
Alignment, чтобы указать, какая часть виджета располагается в точке привязки.
Offsets, чтобы применить смещение относительно точки привязки.
SizeToContent, чтобы по необходимости менять размер виджета.

Ниже показано, как изменение полей Offsets влияет на место отображения виджета относительно точки привязки.

Верхнее поле смещения: 0,0

Верхнее поле смещения: 50,0

Ниже показано, как изменение поля Alignment влияет на то, какая часть виджета находится в точке привязки.

Выравнивание установлено по средней части виджета, vector2{X := 0.5, Y := 0.5}

Выравнивание установлено по верхней левой части виджета, vector2{X := 0.0, Y := 0.0}

Ниже показано, как изменение минимальной и максимальной точек привязки может влиять на размер виджета.

Минимальная и максимальная точки привязки являются одинаковыми: vector2{X := 0.5, Y := 0.5}

Минимальная и максимальная точки привязки различаются: Minimum := vector2{X := 0.4, Y := 0.4}, Maximum := vector2{X := 0.6, Y := 0.6}

Пример размещения виджетов на экране

Следующий код содержит пример размещения виджетов в различных точках экрана.

Расположение виджетов по рабочей области

Verse

using { /Fortnite.com/Devices }
using { /Verse.org/Simulation }
using { /UnrealEngine.com/Temporary/UI }
using { /Fortnite.com/UI }
using { /UnrealEngine.com/Temporary/SpatialMath}

hello_world_device := class(creative_device):

    # Set the Button device in the Editor to reference the device in the level
    @editable