当前位置: 首页 > Web前端 > HTML

SAPUI5SimpleForm的两列布局

时间:2023-03-28 18:01:24 HTML

如果将表单放置在全屏应用程序中并且它包含多个表单组,请使用标签字段比例为12:12:0的两列布局(标签使用12网格列,标签使用12个网格列字段,空列使用0个网格列)。看一个具体的例子:Formwithseveralformgroups(twocolumns)–SizeM(12:12:0)SizeL(DesktopScreens)如果表单包含单个表单组,请使用3:5的标签字段比例:4单列布局(3个网格列用于标签,5个网格列用于字段,以及空列)。如果表单包含多个formgroup,也可以使用标签-字段比例为12:12:0的双列布局(12个网格列用于标签,12个网格列用于字段,0个网格列由空列组成使用).正如响应能力(断点)部分中所述,大小L降至1025像素。在此尺寸下,放置在字段旁边的长标签可能不适合较小的L尺寸屏幕(尤其是在拆分应用程序中)。所以标签放在字段上方。下图中的示例:具有多个表单组(两列)的表单–大小L(12:12:0)大小XL(桌面宽屏)如果表单包含单个表单组,请使用3的标签字段比率:5:4单列布局(3个网格列用于标签,5个网格列用于字段,以及空列)。示例:具有单个表单组(一列)的表单–SizeXL(3:5:4)响应式网格布局具有新属性singleContainerFullSize。此属性允许您在表单中插入空列:例如,您可以将属性columnsXL设置为2,以使用标签-字段比率为??4:8:0的单个表单组填充列(使用4个网格列按标签,字段8个网格列和0个网格列为空列),并将第二列留空。