3.5.2.2.9. layout

layout界面布局的根节点元素,是一个可以对组件进行垂直布局的容器,类似 vbox

layout 的属性:

  • spacing - 设置布局中各组件之间的留白空隙。

  • margin - 设置外边框和布局内容之间的缩进

  • expand - 设置布局内的一个组件使用组件摆放方向的所有可用空间。

  • responsive - 设置容器应当按照可用空间进行响应式更改。

  • stylename - 定义布局的一个样式名称。

  • height - 设置布局的高度。

  • width - 设置布局的宽度。

  • maxHeight - 设置窗口布局最大的 CSS 高度,比如 "640px""100%"

  • minHeight - 设置窗口布局最小的 CSS 高度,比如 "640px""100%"

  • maxWidth - 设置窗口布局最大的 CSS 宽度,比如 "640px""100%"

  • minWidth - 设置窗口布局最小的 CSS 宽度,比如 "640px""100%"

示例:

<layout minWidth="600px"
        minHeight="200px">
    <textArea width="800px"/>
</layout>
layout 1
Figure 20. 布局中不带滚动条的完整大小的 textArea
layout 2
Figure 21. 当窗口的大小小于布局的最小尺寸时,滚动条出现

这些属性在弹出对话框中也有效:

<dialogMode forceDialog="true"
            width="500"
            height="250"/>
<layout minWidth="600px"
        minHeight="200px">
    <textArea width="250px"/>
</layout>
layout 3
Figure 22. 对话框模式,当窗口的大小小于布局的最小尺寸时,滚动条出现