如果表單包含單個表單組，請使用標籤欄位比例為 3:5:4 的單列布局（標籤使用 3 個網格列，欄位使用 5 個網格列，以及 空列）。

![](https://img-blog.csdnimg.cn/img_convert/80a2994eb98d259e753ad42ec032b709.png)

如果將表單放入全屏應用程式中，您還可以使用屬性 singleContainerFullSize 將 columnsXL 設定為 3，以 12:12:0 的標籤欄位比例用單個表單組填充一列（12 個網格列由 標籤、欄位使用的 12 個網格列和空列使用的 0 個網格列），並將第二列和第三列留空。

例子：Form with single group in a column layout - Size XL - (12:12:0)

![](https://img-blog.csdnimg.cn/img_convert/c849c10b021c60da84fdeb4e5069ec36.png)

如果表單包含多個表單組，還可以使用標籤欄位比例為 4:8:0 的兩列布局（標籤使用 4 個網格列，欄位使用 8 個網格列，0 個網格列 由空列使用）。

![](https://img-blog.csdnimg.cn/img_convert/92687c14840ecda710325d9651a073de.png)

如果將表單放入全屏應用中並且包含多個表單組，您還可以使用標籤欄位比例為 12:12:0 的三列布局（標籤使用 12 個網格列，12 個網格 欄位使用的列，空列使用的 0 個網格列）。

![](https://img-blog.csdnimg.cn/img_convert/ce2cba423ae6fa97f86648678fe4b4a9.png)

![](https://img-blog.csdnimg.cn/img_convert/c6fae0e3ff9a088d3c997afad7b7acf0.png)

如果您對 XL 螢幕使用三列布局，請不要對 L 和 M 螢幕使用兩列布局，因為它會產生大量空白。 在這種情況下，請改用單列布局。

下面是 2 列布局下，造成很多空白區域浪費的例子：
![](https://img-blog.csdnimg.cn/img_convert/96b7546a973cbf17bed1de57be0b4473.png)

正確的做法是使用 single column 佈局：
![](https://img-blog.csdnimg.cn/img_convert/a75ae2a4856d2179a793f2186e996c2a.png)

與所有其他 XL-L-M-S 屬性不同，直到 SAPUI5 版本 1.34 的 labelSpanL 和 labelSpanM 不遵循 XL-L-M-S 大小范式。 LabelSpanL 在包含多於一列的佈局中設定標籤跨度，而 labelSpanM 在僅包含一列的佈局中設定標籤跨度。 自 1.34 版以來，這已更改。 由於向下相容，新引數 adjustLabelSpan 是必要的。 同樣由於向下相容，它的預設值為“true”，這導致 labelSpan 屬性的舊行為。 要實現 labelSpan 屬性的新的、正確的行為，您必須將 adjustLabelSpan 設定為“false”。

SAP UI5 SimpleForm 在 size XL 下的佈局開發

相關文章