Line break in XMLView UI5

Question

How can I set a line break between two controls?

I want to display one by one in vertical manner.

Answer 1

You can use a flex box control: either <VBox> or <HBox>.

<VBox xmlns="sap.m" wrap="Wrap" renderType="Bare">
  <!-- ... -->
</VBox>

Answer 2

You don't really use linebreaks but layout controls.

If you want to have an element below another element, put both of them in a vertical layout.

https://sapui5.hana.ondemand.com/explored.html#/entity/sap.ui.layout.VerticalLayout/samples

<l:VerticalLayout>
    <Input placeholder="UserID" />
    <Input placeholder="Password" type="Password" />
</l:VerticalLayout>

Don't forget to include the namespace: xmlns:l="sap.ui.layout"

You can also nest different layouts: Outer layout is vertical, and each row of the vertical layout can be a horizontal layout where items are placed next to each other.

---

Edit: This also works in IE9. VBox unfortunately does not work in IE9.