Sap.ui.layout.form(简单)表单中的进度指示器对齐问题 [英] Issue with Progress Indicator alignment in sap.ui.layout.form.(Simple)Form

问题描述

ProgressIndicator应在同一行中垂直对齐。

当前产量：

<form:SimpleForm id="idSimpleForm"
  editable="false"
  layout="ResponsiveGridLayout"
  maxContainerCols="2"
  columnsM="2"
  singleContainerFullSize="false"
  labelSpanS="5"
>
  <Label text="Lines Of Code"/>
  <Text text="{...}"/>
  <Label text="CSS"/>
  <ProgressIndicator percentValue="100" state="Success"/>
  <Text text="{...}"/>
  <Label text="XML"/>
  <ProgressIndicator percentValue="30" state="Success"/>
  <Text text="{...}"/>
  <Label text="JavaScript"/>
  <ProgressIndicator percentValue="20" state="Success"/>
  <Text text="{...}"/>
</form:SimpleForm>

所需输出：

推荐答案

只需将displayOnly设置为true即可。

<form:SimpleForm layout="ResponsiveGridLayout">
  <Label text="CSS"/>
  <ProgressIndicator displayOnly="true" displayValue="14k" percentValue="100" state="Information" />
  <Label text="XML"/>
  <ProgressIndicator displayOnly="true" displayValue="7.3k" percentValue="30" state="Information" />
  <Label text="JavaScript"/>
  <ProgressIndicator displayOnly="true" displayValue="2.1k" percentValue="20" state="Information" />
</form:SimpleForm>

^{发件人：https://jsbin.com/huvokeg/edit?js,output}

避免自定义CSS。

这篇关于Sap.ui.layout.form(简单)表单中的进度指示器对齐问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！