Question

有没有一种方法可以使用sap.ui.layout.Grid每行获得5个单元格。

当span为2时，我可以获得6个像元当span为3时为4个单元格， span为4时为3个单元格。

但是使用此控件似乎无法获得5个单元格的行。有想法吗？

Answer 1

默认情况下，网格将屏幕分隔为12列。跨度指示您要划分的每个部分的大小。在跨度为2的示例中，由于12/2 = 6，结果为6个像元。

由于您不能为跨度指定小数位数，因此您可以尝试缩进。如果您选择示例中的跨度2，但是在第一个元素1上使用了缩进，则只会出现5列，因为您没有足够的空间容纳第六个元素（1 + 2 + 2 + 2 + 2 + 2 = 11->因此+2列没有空格）。这样一个简单的示例就可以使您看到实际的效果：

<mvc:View
       xmlns:mvc="sap.ui.core.mvc"
       xmlns:l="sap.ui.layout"
       xmlns="sap.ui.commons"
       controllerName="sap.ui.layout.sample.GridProperties.GridProperties"
       xmlns:html="http://www.w3.org/1999/xhtml">
<l:VerticalLayout
            width="100%">
<l:Grid defaultSpan="XL2 L2 M5 S12" position="Center">
<l:content>
  <Label text="Text">
   <layoutData>
      <l:GridData span="XL2 L2" indent="XL1" />
    </layoutData>
  </Label>
    <Label text="Text">
    <layoutData>
      <l:GridData span="XL2 L2"/>
    </layoutData>
  </Label>
    <Label text="Text">
    <layoutData>
      <l:GridData span="XL2 L1" />
    </layoutData>
  </Label>
    <Label text="Text">
    <layoutData>
      <l:GridData span="XL2 L2" />
    </layoutData>
  </Label>
  <Label text="Text">
    <layoutData>
      <l:GridData span="XL2 L2" />
    </layoutData>
  </Label>
  <Label text="Text">
    <layoutData>
      <l:GridData span="XL2 L2" />
    </layoutData>
  </Label>
</l:content>
</l:Grid>
</l:VerticalLayout>
</mvc:View>

如果您从第一个标签上删除缩进，则会在同一行中看到6个标签，否则只会显示5个。

希望这会有所帮助！

SAP UI5中具有五个单元格的网格

1 个答案: