Repeat Container

This article describes the Repeat Container component and its properties.

The Repeat Container automatically repeats components in rows and updates the bindings accordingly. You can easily create a vertical list layout as is common in user interfaces.

Select Repeat Container from the containers category of the component library. Move the mouse cursor over the canvas and click on the position you would like to add a Repeat Container to your project:

The behavior and appearance of the Repeat Container are very similar to the single container component. Refer to the how-to article on the Container for information on its core functionality.

Repeat Container Properties

The Repeat Container properties consist of GENERAL and DYNAMIC VISIBILITY drawers. This guide will describe the general properties only; the dynamic visibility properties are generic to each component and a separate guide and tutorial on dynamic visibility can be found here.

---

GENERAL

• Repeat As - Radio options to switch the container orientation between Rows or Columns.

Although the option allows the container to orient between repeating Rows or Columns, the spreadsheet formatting remains the same. That is the data is formatted in a row-by-row format.

• Override Bindings Data – Select the range containing the data block you want to drive the Repeat Container. The ‘Override Bindings Data’ property will create a new row of objects for each row in the range specified. Components placed inside the Repeat Container automatically have any bindings within this range updated. Properties bound to cells outside of the range remain unchanged.

• Edge padding Size – Objects placed within the container gain a border around them that determines the positioning of the repeated components.

The XY positioning is used to set the component’s left and top “padding”; the edge padding is used to set the right and bottom padding of the repeated area.

• Enable Scrollbars – Select the checkbox beside ‘Enable Scrollbars’ to allow scrolling within the container.

---

See it in action

Spreadsheet formatting

In the example below we have bound various properties for the components to data within the first row of the Override binding data range.

Select confirm and you can see the corresponding and repeating components have adopted the property value of each row of data in the spreadsheet.

Row Orientation

This is the final look of the component after the bindings have been placed in Row Orientation.

Column Orientation

This is the final look of the component after the bindings have been placed in Column Orientation.

All repeated items shown are “ghost replicas” of the original components; they are not separate components themselves. To edit these replicas, all changes have to be made to the original components.