如何以不可编辑的形式垂直对齐复选框？

本文介绍了如何以不可编辑的形式垂直对齐复选框？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

SAPUI5简单格式不会使复选框垂直居中对齐。

SAPUI5 simple form does not make the checkboxes vertically center align.

此处代码是：

<form:SimpleForm title="{i18n>wizardDateLocation}" minWidth="1024" editable="false" layout="ResponsiveGridLayout" > <Label text="{i18n>wholeDay}"/> <CheckBox selected="{/IsAllDay}" editable="false"/> <Label text="{i18n>date}" visible="{= ${/IsAllDay}}" required="true"/> <Text text="{/Start}" visible="{= ${/IsAllDay}}"/> <HBox></HBox> <Label text="{i18n>from}" visible="{= !${/IsAllDay} }" required="true"/> <Text text="{/Start}" visible="{= !${/IsAllDay} }"/> <Label text="{i18n>to}" visible="{= !${/IsAllDay} }" required="true"/> <Text text="{/End}" visible="{= !${/IsAllDay} }"/> <Label text="{i18n>isOnlineMeeting}" required="false"/> <CheckBox selected="{/IsOnlineMeeting}" editable="false"/> <Label text="{i18n>location}" required="{= !${/IsOnlineMeeting} }"/> <Text text="{/LocationName}"/> <Label text="{i18n>weblink}" required="{/IsOnlineMeeting}"/> <Text text="{/WebLink}"/> <Link press="editStepTwo" text="{i18n>edit}"/> </form:SimpleForm>

如何解决此问题？

推荐答案

UI5为通常可编辑但以不可编辑形式出现的控件提供 displayOnly 属性。

UI5 provides displayOnly property for controls that are usually editable but occur in a non-editable form.

因此，与其使整个表单可编辑，这是矛盾的，因为其余的表单字段只是文本（不可编辑），请尝试启用 displayOnly 在CheckBoxes上。

Hence, instead of making the whole form editable, which is contradictory since the rest of the form fields are just texts (non-editable), try enabling displayOnly on CheckBoxes.

<form:SimpleForm editable="false"> <!-- ... --> <CheckBox displayOnly="true" /> <!-- ... --> </form:SimpleForm>

来自 API参考：

displayOnly

设置为 true 时， CheckBox 不是交互式的，不可编辑的，不可聚焦的且不在选项卡链中。 此设置在查看模式下用于表单。 如果启用的属性设置为false，则此属性无效。 displayOnly

When set to true, the CheckBox is not interactive, not editable, not focusable and not in the tab chain. This setting is used for forms in review mode. When the property enabled is set to false this property has no effect.