4.5.2.2.7. GroupBoxLayout
ДЕМОНСТРАЦИЯ

GroupBoxLayout - контейнер, позволяющий выделить рамкой содержащиеся в нем компоненты, и задать им общий заголовок. Кроме того, он умеет сворачивать свое содержимое.

gui groupBox

XML-имя компонента: groupBox.

Пример описание контейнера в XML-дескрипторе экрана:

<groupBox caption="Order">
    <dateField datasource="orderDs" property="date" caption="Date"/>
    <lookupField datasource="orderDs" property="customer"
                 optionsDatasource="customersDs" caption="Customer"/>
    <textField datasource="orderDs" property="amount" caption="Amount"/>
</groupBox>

Атрибуты groupBox:

  • caption - заголовок группы.

  • orientation - задает направление расположения вложенных компонентов − horizontal или vertical. По умолчанию vertical.

  • collapsable − значение true позволяет пользователю скрывать содержимое компонента с помощью значков gui_groupBox_minus/gui_groupBox_plus.

  • collapsed − если указано значение true, то содержимое компонента будет свернуто сразу после открытия экрана. Используется совместно с collapsable="true".

    Пример свернутого GroupBox:

    gui groupBox collapsed

  • showAsPanel – если указано значение true, то компонент будет выглядеть как Vaadin Panel. Значение по-умолчанию - false.

    gui groupBox Panel

Контейнер groupBox по умолчанию имеет ширину 100% аналогично vbox.

В веб-клиенте с темой, основанной на Halo, к компоненту groupBox можно применить предопределенные стили. Стили задаются в XML-дексрипторе или контроллере экрана с помощью атрибута stylename. Чтобы применить стиль программно, выберите одну из констант класса HaloTheme с префиксом компонента LAYOUT_ или GROUPBOX_. Следующие стили должны использоваться совместно с атрибутом showAsPanel, имеющим значение true:

  • стиль borderless удаляет рамку и фон контейнера groupBox:

    groupBox.setShowAsPanel(true);
groupBox.setStyleName(HaloTheme.GROUPBOX_PANEL_BORDERLESS);

  • стиль card придаёт контейнеру вид карточки.

  • стиль well делает контейнер "утопленным" с затемнением фона:

    <groupBox caption="Well-styled groupBox"
          showAsPanel="true"
          stylename="well"
          width="300px"
          height="200px"/>
    gui groupBox Panel 2
Атрибуты groupBox

align - caption - collapsable - collapsed - expand - height - id - orientation - spacing - stylename - width

Предопределенные стили groupBox

borderless - card - well