ScrollBoxLayout

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

scroll box default

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

Основы

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

<scrollBox height="150px"
           width="300px"
           spacing="true"
           caption="ScrollBox">
    <label value="Date"/>
    <dateField/>
    <label value="TextField"/>
    <textField/>
    <label value="TextArea"/>
    <textArea height="130px"/>
    <hbox spacing="true">
        <button caption="Button"/>
        <button caption="Button"/>
    </hbox>
</scrollBox>

Атрибуты

scrollBars

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

  • vertical - включает вертикальную прокрутку, по умолчанию.

  • horizontal - включает горизонтальную прокрутку.

  • both - включает прокрутку в обоих направлениях

  • none - запрещает прокрутку в любом направлении.

Если размер компонентов внутри контейнера превышает размер контейнера, соответствующая полоса прокрутки появится автоматически.

Размер содержимого

  • contentHeight - устанавливает высоту содержимого.

  • contentWidth - устанавливает ширину содержимого.

  • contentMaxWidth - устанавливает максимальную ширину содержимого. Ширина содержимого контейнера не может стать больше, даже если размер экрана позволяет.

  • contentMaxHeight - устанавливает максимальную CSS-ширину для содержимого.

  • contentMinWidth - устанавливает минимальную ширину для содержимого.

    <scrollBox height="150px"
               width="100%"
               contentMinWidth="300px">
        <label value="Date"/>
        <dateField/>
        <label value="TextField"/>
        <textField/>
        <label value="TextArea"/>
        <textArea height="130px"/>
        <hbox spacing="true">
            <button caption="Button"/>
            <button caption="Button"/>
        </hbox>
    </scrollBox>
    scroll box min width
  • contentMinHeight - устанавливает минимальную высоту для содержимого.

    <scrollBox height="100%"
               width="300px"
               contentMinHeight="300px">
        <label value="Date"/>
        <dateField/>
        <label value="TextField"/>
        <textField/>
        <label value="TextArea"/>
        <textArea height="130px"/>
        <hbox spacing="true">
            <button caption="Button"/>
            <button caption="Button"/>
        </hbox>
    </scrollBox>
    scroll box min height

Содержимое ScrollBox может уменьшить свой размер до значений, установленных в атрибутах contentMinWidth или contentMinHeight.

Рекомендуется установить ширину и высоту содержимого. В противном случае компоненты, размещенные в scrollBox, должны иметь фиксированный размер или размер по умолчанию. Не устанавливайте размер вложенных компонентов в height="100%" или width="100%", если ширина и высота содержимого не заданы.