All Collections
Viz Flowics
Building Blocks
Using the Dynamic Content List Building Block
Using the Dynamic Content List Building Block
Updated over a week ago

A Dynamic List is a Building Block that allows you to list elements coming from a Data Provider. For that reason, the Dynamic List must be added as a child of Data providers such as External Connectors, Google sheets, Collection Provider, among others.

A List Item will automatically be added to this Dynamic List, which will group the Buildings Blocks that will use some type of data linked instead of showing static values (such as text, images, progress bar, etc). That is, Building Blocks gets its value from a superior provider (such as text that shows the name of a Poll or a list that represents the items in Mechanic or other providers).

The conditional visibility settings of the elements are configured since these conditions are another form of the data link (something is shown or hidden depending on some value of the data that comes from the Provider).


Remember, an Overlay will be created automatically if you didn't add it to the Tree after adding an element.

To learn how to add elements to the Tree, click here‍.

Properties

Use the Inspector‍, right-sidebar, to customize the Dynamic Content List

List Settings

Data Source: Use it to connect the Dynamic content list to the Data Provider. You will be able then to connect each building block to the Data Source's variable.

Filters: You may add filters in order to narrow down your items you wish to display. For example you may add a pagination filter which has been set to display 4 items per page, starting from the first element of the list. Set the Items per page number according to the number of options your mechanic has.

Take into account

All List Items can not be deleted and will be repeated according to the pagination settings. This is why you won't be able to move each option individually, if you wish to do so please visit the following article: Moving individually the options of your Mechanic‍.

If the Dynamic Content list is not paginated, it will always show as many List Items as Items coming from your data, stretching and taking all your available list space.

Cycle

Cycle Control: Allows you to control the pages cycle you have configured. You can set the cycling in 3 different modes: manually, automatic or semi-automatic. You will find this feature in the Collection Provider's inspector

Layout (horizontal/vertical)

Type: Control how the Data will be displayed. It can be horizontal (Columns), vertical (Rows) or grid. For more information, read the article about Layout Options in Dynamic Lists.

Position and Size

Position: Change the Dynamic Content List position inside the Canvas according to the X and Y axis (in percentage relative to the configured screen resolution).

Size: Change the Dynamic Content List size inside the Canvas according to its width and height (in percentage relative to the configured screen resolution).

Rotation: You may rotate your element in any degree.

Appearance

Opacity: Set the transparency percentage of the Dynamic Content List element.

Background

Within the Inspector, you can modify the element backgrounds look and feel. It can be a solid color, a gradient, or an image.

Learn how to implement these properties specific to backgrounds by clicking here.

Borders

Style: Defines the sides and style of the border.

Width: Defines how wide the border will be.

Color: Choose a color for the border.

Radius: Increasing this number will round the corners of the rectangle.

Learn how to change these properties specific to borders by clicking here.

Did this answer your question?