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 15. 布局中不带滚动条的完整大小的 textArea
layout 2
Figure 16. 当窗口的大小小于布局的最小尺寸时，滚动条出现

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

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