Container

Настройки внешнего вида и настроек:

Name (обязательно) - имя компонента.

Direction (обязательно) - как расположены элементы внутри контейнера, вертикально или горизонтально. По умолчанию горизонтально.

Wrap (обязательно) - обертывание содержимого, когда оно выходит за границы контейнера. По умолчанию Nowrap

Alignment (обязательно) - выравнивание элементов в контейнере. Start по умолчанию.

Sizes (обязательно) - размеры контейнера. В пикселях или процентах. Ширина 100% по умолчанию

Max Width (обязательно) - максимальная ширина контейнера в пикселях или процентах. 100% по умолчанию.

Margin (обязательно) - внешний отступ. 0 по умолчанию.

Padding (обязательно) - внутренний отступ. 0 по умолчанию Изображение, градиент или наложение (не обязательно) - для фона.

Background color (не обязательно) - основной цвет для фона.

Border (не обязательно) - настройки границ компонента.

Visible (обязательно) - делает компонент видимым, если включен. По умолчанию включено.

Триггеры рабочего процесса:

• onCreate - срабатывает, когда элемент создается на странице;
• onShow - срабатывает, когда компонент меняет свое состояние на видимое (отображается на странице);
• onHide - срабатывает, когда компонент меняет свое состояние на скрытое (перестает отображаться);
• onDestroy - срабатывает, когда компонент уничтожается;
• onClick - срабатывает при нажатии на компонент.

Действия компонента:

Container get properties

Получает свойства контейнера.

Входные параметры:

• Component Id [string] - идентификатор компонента контейнера.

Выходные параметры:

• Width [string] - ширина компонентов;
• Height [string] - высота компонента;
• Flex direction [enum] - направление компонентов;
• Wrap [enum] - обертывание компонентов;
• Alignment horizontal [enum] - выравнивание компонента по горизонтали;
• Alignment vertical [enum] - выравнивание компонента по вертикали;
• Margin [string] - margin компонента;
• Padding [string] - padding компонента;
• Border [string] - border компонента;
• Background color [string] - цвет фона компонента;
• Visible [boolean] - состояние видимости компонента.

Container set properties

Получает свойства контейнера.

Входные параметры:

• Component Id [string] - идентификатор компонента контейнера.

Выходные параметры:

• Width [string] - ширина компонента;
• Height [string] - высота компонента;
• Flex direction [enum] - направление компонента;
• Wrap [enum] - обертывание компонента;
• Alignment horizontal [enum] - выравнивание компонента по горизонтали;
• Alignment vertical [enum] - выравнивание компонента по вертикали;
• Margin [string] - margin компонента;
• Padding [string] - padding компонента;
• Border [string] - border компонента;
• Background color [string] - цвет фона компонента;
• Visible [boolean] - состояние видимости компонента.

Container update properties

Обновление свойств контейнера

Входные параметры:

• Component Id [string] - идентификатор компонента container;
• Width [string] - ширина компонента;
• Height [string] - высота компонента;
• Flex direction [enum] - направление компонента;
• Wrap [enum] - обертка компонента;
• Alignment horizontal [enum] - выравнивание компонента по горизонтали;
• Alignment vertical [enum] - выравнивание компонента по вертикали;
• Margin [string] - margin компонента;
• Padding [string] - padding компонента;
• Border [string] - border компонента;
• Border radius [string] - радиус границы компонента;
• Background color [string] - цвет фона компонента;
• Visible [boolean] - состояние видимости компонента.

Пример использования

Контейнер можно использовать для группировки элементов. Например, для сборки формы из нескольких различных полей ввода: