关于前端:SAP-UI5-Form-表单-Column-Layout-下的-Column-个数分配问题

50次阅读

共计 690 个字符,预计需要花费 2 分钟才能阅读完成。

ColumnLayout 控件以基于列的响应形式出现表单组。依据其大小,该组被分为一列或多列。

  • XL – max. 6 columns
  • L – max. 3 columns
  • M – max. 2 columns
  • S – 1 column

对于 XL 码,SAP 倡议对蕴含大量内容的大型表单应用残缺的 6 列。这在组织内容和表单组时为用户提供了更大的灵活性。​

为了更好地利用屏幕空间并在不滚动的状况下为用户提供更好的概览,咱们能够跨多个列平衡表单组。依据组元素的数量及其大小,组元素扩散到列中。

听起来有点形象?

看个具体的例子:

  • 4 列和 2 组:每组将应用 2 列。
  • 3 列 2 组:较大的应用 2 列,较小的应用 1 列。

组元素 (group element) 的大小将由调配给它的可见元素 (visible element) 的数量决定。如果组多于列,则每个组仅应用一列。所以表单控件的最初一行不会被齐全应用。这将导致空白。

表单元素分布到以相似报纸的顺序排列的组的列中。标签和字段的地位取决于所用列的大小。如果有足够的空间,标签在字段旁边,否则在字段上方。

如果应用默认表单设置,每个表单组将显示在独自的列中。依据表单组的大小,这可能意味着用户须要向下滚动能力查看残缺的表单,即便屏幕右侧有未应用的空间。

下图是一个默认的 form group 的布局状况:

一个 form group,基于 balanced column layout:

2 个 form groups,应用默认布局:

2 个 form groups,应用 balanced column 布局:

在 Dynamicforms 中,表单的内容、行为和款式由 JSON 定义。要创立表单,开发人员须要增加表单控件并定义其属性,例如控件类型、名称、标签等。

正文完
 0