Flexible layout
An Element containers can flexibly determine both the orientation and the alignment of its content.
The settings can be made in the 'Layout' properties section of the editor.
Orientation
Determines the arrangement of the child elements.
Vertical |
Horizontal |
Elements are arranged below each other |
Elements are arranged next to each other |
|
|
Alignment
Determines how the elements should be arranged and aligned.
A distinction is made between horizontal and vertical alignment (e.g. left and top).
Depending on the orientation of the container, other alignment options are available in each case.
The icons of the options show how the elements are aligned. The currently selected options are highlighted accordingly.
Vertical option |
Horizontal option |
|
|
Alignments where the elements spread over the available space (the last two in each case) are available for the opposite orientation in each case only if the 'Elements can wrap' option is enabled.
If more than one flexible layout container is selected, only the options that are valid for both containers are displayed. e.g.
Elements can wrap
This option determines whether the elements can wrap in the orientation direction when the space in a row/column is no longer sufficient.
Example
Elements can not wrap |
Elements can wrap |
|
|
Special feature: 'Repeating element' and 'Optional elements'
Within a flexible layout container, the orientation of repeated and optional elements also depends on the orientation set.
Example
Alignment: vertical |
Alignment: horizontal |
|
|
In addition, the position of the +/- buttons can also be set in the "Layout" properties section.
Examples
Settings |
Display |
|
|
|
|
|
|