Understanding the Grid layout

General information about each part of a Grid layout is provided in this section. Information about using the Layout Editor to work on each part of a Grid layout is provided in Using layout tools.

To better understand these Grid layout concepts, you can view the Main layout in an Infor portal. In the Portal Manager, connect to the portal and then select Content Development > Layouts. Right-click the UI cell for the Main layout and select View Layout UI.

About regions

IPF has two types of regions: the Main region and floating regions. Both can be bound to a data collection or unbound.

A floating region is not attached to the Main region grid; however, a bound floating region is like an extension of one of the records in the Main region, and it creates the same region for each row returned in the Main region. For example, if the Main region contained Item #, and a bound floating region contained Item Description, then on the portal, users would see the item description for each item number in the Main region.

An unbound floating region has no connection to the rows in the Main grid, so typically it does not display data from the same collection as Main. Also, the unbound floating region creates just one region, not regions for multiple rows.

About cards

All regions contain cards, which act as containers for layout tables. Cards in floating regions and embedded regions can be of two types: stack and sequence.

Stack is the default card type. At runtime, only one card at a time can be visible in a card stack. The first card in a stack is the default card in the Layout Editor. This card is used during rendering, unless it is changed through scripting. See Card stacks and card sequences.

The sequence card type is used primarily for responsive UI layouts. This type allows for multiple cards to be rendered next to each other at runtime. Depending on the size of the portal user’s viewport, all cards in a sequence may not fit inside of the container, so the sequence breaks onto the next line to render the remaining cards.

The Main region can contain only one card. Floating regions support multiple cards, and they can be configured as either a card stack or a card sequence.

About cells

A card contains a layout table with cells. Each cell can be empty, bound to a property, unbound, or it can contain an embedded region. An embedded region is a nested region placed inside of the cell. An embedded region can contain one or more cards with layout tables, similar to the parent regions.