ProApp Designer - Release 14.10 (Package 32)

Layout Controls

Layout controls can organize simple and collection controls with a proper layout in the page.

Section

Section control is a layout control to organize group controls placed inside it. Section controls are vertically stacked one over the other. Section controls are the top-level container controls exists in pages and flyouts. By defining display condition or access permissions, section control can be shown or hidden based on the evaluation criteria. In the picture below, Part Documents and Video & Help represents sections in the page.

Group

Group control is a layout control to organize child controls placed inside it. Group controls are horizontally stacked beside each other inside a section control. When multiple group controls are placed inside section control, they equally take the available width. When you resize the page on desktop, based on the available width they can be shown in single row or multiple rows inside a section control. In mobile view, they will be vertically stacked inside a section control. By defining display condition or access permissions, group control can be shown or hidden based on the evaluation criteria. In the picture below, Details, Quantity & Weight, Logo, Part Details represents groups within ‘Supplier Details’ section.

Panel

Panel control is the layout control that can help you to create a complex layout on the page. Panel control can be created just like a page with section controls within it. Panel control can be placed within group control just like any other child control. It can also be used as tabs within Tab control. In picture below, ‘Supplier Files’ represents panel control, that is placed inside the group.

Tab

Tab control can be used to show associated panels as tabs. In the picture below, Information and Parts together represents Tab control built based on the panels.