vbox

ДЕМО

vbox располагает все вложенные компоненты в один вертикальный столбец.

  • XML-элемент: vbox

  • Java-класс: VerticalLayout

Основы

Пример расположения трех компонентов в одном столбце:

<vbox id="vbox" >
    <textField placeholder="TextField"/>
    <button text="OK"/>
    <button text="Cancel"/>
</vbox>
vbox basic

Атрибуты

id - alignItems - alignSelf - boxSizing - classNames - colspan - css - enabled - expand - height - justifyContent - margin - maxHeight - maxWidth - minHeight - minWidth - padding - spacing - visible - width

boxSizing

MDN

Задает способ вычисления общей ширины и высоты элемента. Возможные значения:

  • UNDEFINED

  • CONTENT_BOX

  • BORDER_BOX

expand

Указывает компонент внутри контейнера, который должен быть расширен для использования всего доступного пространства. В случае vbox этот атрибут устанавливает высоту компонента на 100%.

justifyContent

MDN

Определяет, как браузер распределяет пространство между элементами содержимого и вокруг них. Возможные значения:

  • START

  • END

  • CENTER

  • BETWEEN

  • AROUND

  • EVENLY

Примеры использования смотрите в разделе Правила компоновки.

margin

MDN

Определяет отступ между внешними границами и содержимым контейнера. Возможные значения - true, false. По умолчанию false.

padding

MDN

Устанавливает внутренние отступы со всех четырех сторон элемента одновременно. Возможные значения - true, false. По умолчанию false.

spacing

Устанавливает промежутки между компонентами внутри контейнера. Возможные значения - true, false. По умолчанию false.

Обработчики

AttachEvent - ClickEvent - DetachEvent

Чтобы сгенерировать заглушку обработчика в Jmix Studio, используйте вкладку Handlers панели инспектора Jmix UI, или команду Generate Handler, доступную на верхней панели контроллера экрана и через меню Code → Generate (Alt+Insert / Cmd+N).

ClickEvent

com.vaadin.flow.component.ClickEvent отправляется, когда пользователь кликает на контейнер.