A group box can be used to visually group related widgets together. Group boxes are displayed as a frame around nested widgets with an optional header. Group boxes can be configured to collapse and expand dynamically.
An example of group box properties is represented in the image below:
Group box properties consist of the following sections:
2.1 Common Section
For more information on properties in this section, see the Common Section section in Properties Common in the Page Editor.
2.2 Design Properties Section
The Design Properties allow you to change spacing and alignment of the widget and hide it on phone, tablet, or desktop, if needed. Design properties may vary depending on the type of the widget. For example, for the text widget you can change its font weight, color, alignment, and letter case.
2.3 General Section
2.3.1 Show Header
Show Header defines whether a header is shown above the group box.
This property is only displayed when the Show Header option is enabled. It defines the caption that is shown in the header.
Default: Group box
This property specifies whether the group box can be collapsed by clicking the header and if so, whether it is displayed collapsed or expanded. This property is only displayed when the Show Header is enabled.
Possible values of this property are the following:
- Yes (start expanded) (default) – the elements inside the group box will be initially displayed and can be collapsed when a user clicks a minus icon in the header
- Yes (start collapsed) – the elements inside the group box will be initially hidden and can be expanded when a user clicks a plus icon in the header
- No – group box elements are always displayed and the group box cannot be collapsed
2.4 Visibility Section
Visibility determines whether a widget is displayed to the end-user as part of the page.
For more information on properties of this section, see the Visibility Section section in Properties Common in the Page Editor.