标签与OpenUI5中的文本不在同一行

Question

我有一个 Form 布局：

<f:layout>
          <f:ResponsiveGridLayout
           labelSpanXL="4" labelSpanL="4" labelSpanM="4" labelSpanS="4"
           emptySpanXL="1" emptySpanL="1" emptySpanM="1" emptySpanS="1"
           columnsXL="2" columnsL="2" columnsM="2"
           singleContainerFullSize="false" />
 </f:layout>

然后在 FormContainer 我有一个带有文本的标签：

<f:FormElement>
        <f:fields>
            <Label text="text">
            </Label>
            <Text text="label">
                <layoutData>
                    <l:GridData span="XL1 L4 M5 S4" />
                </layoutData>
            </Text>
        </f:fields>
</f:FormElement>

它看起来很糟糕 - 标签与文本不在同一行（行更高，请参见下面的屏幕截图）

为什么会这样？为什么不在同一行？

Answer 1

你可能做错了。根据 API Reference，您可以为 formElement 中的字段定义标签，而您正在尝试将标签定义为 formElement 中的另一个字段。

您可以试试下面的代码：

     <f:FormContainer title="Form title">
         <f:formElements>
          <f:FormElement label="Email">
           <f:fields>
            <Text text="EMail" />
           </f:fields>
          </f:FormElement>
          <f:FormElement label="Teleephone">
           <f:fields>
            <Text text="Tel" />
           </f:fields>
          </f:FormElement>
          <f:FormElement label="SMS">
           <f:fields>
            <Text text="Sms" />
           </f:fields>
          </f:FormElement>
         </f:formElements>
        </f:FormContainer>

希望这能解决您的问题。

标签与OpenUI5中的文本不在同一行

Label not in the same line with text in OpenUI5

xml

layout

sapui5