SAP UI5：将简单表单​​标签和字段重新对齐到左侧

Question

我需要将所有这些突出显示的元素移动到页面的左侧（已连接屏幕）。下面是我的xml视图中简单表单的代码：

<--- XML视图--->

<f:SimpleForm id="SimpleFormDisplay354" minWidth="1024" maxContainerCols="3" editable="false" layout="ResponsiveGridLayout"
				title="{i18n>searchFormTitle}" labelSpanL="3" labelSpanM="3" emptySpanL="4" emptySpanM="4" columnsL="1" columnsM="1">
				<f:content>
					<Label text="{i18n>labelDate}" labelFor="datePickerId" design="Bold" >
						<layoutData>
							<l:GridData span="L2 M3 S6"/>
						</layoutData>
					</Label>
					<DatePicker id="datePickerId" visible="true" displayFormat="MMM dd,yyyy" valueFormat="dd-MM-yyyy" placeholder="{i18n>dateInput}"
						change="handleChange">
						<layoutData>
							<l:GridData span="L2 M3 S6"/>
						</layoutData>
					</DatePicker>
					<Button text="{i18n>search}" id="searchButton" width="50%" type="Emphasized" class="Button" press="OnDateSearch">
						<layoutData>
							<l:GridData span="L2 M3 S6"/>
						</layoutData>
					</Button>
				</f:content>
			</f:SimpleForm>

任何人都可以帮助我进行哪些设置以将这些元素移动到最左端的GridData跨度设置？

enter image description here

Answer 1

您必须将labelSpanL / labelSpanM设置为1或2以减少左侧空间，但是SimpleForm始终将标签向右对齐，并将冒号“：”置于Label和Control之间。

如果labelSpan 1或2无法解析。我知道的唯一方法就是尝试使用CSS。

Answer 2

如果要将现有属性用于Grid Data，则可以使用indentL属性。

<Label text="{i18n>labelDate}" labelFor="datePickerId" design="Bold" >
    <layoutData>
        <l:GridData span="L1 M3 S6" indentL="0"/>
    </layoutData>
</Label>

将标签的一列（共12列）给标签，然后将其缩进0（对于大屏幕，span值= 0），同样，您可以对不同的屏幕尺寸进行处理。