Iterated Text elements

This article is outdated. While the concepts described probably still apply, much of the interface has changed. The article is currently being updated.

This is a list of text elements that the user can edit in a controlled way. The user can create or delete elements in this list and, of course, change their text content.

Let's start at the beginning:

In this example, there are two elements that are iterated: The text element and the path element (the arrow). The number of copies created by the iteration is determined by the number of text input modules within the collection module. So, to get started, you must first create a collection module.

The collection module in itself does not do much yet. The next step will be to iterate the text and path elements, using the collection as the iteration length.

To link the content of the iterated text elements to the text modules in the collection module, you can simply use the expression editor to access the sub-properties of the collections (i.e. each module within the collection).

Note that when using expressions for the Text-Content property, the entire expression must be enclosed in a "STRING_LITERAL" function.

When iterating path elements, you have two options regarding the spacing and positioning of the copies. You can either position each of the anchor points individually or use the translate properties to move the element as a whole:

For now, we've simply used linear spacing between each item in the list. Unfortunately, this means that the list can spill outside the canvas or into other elements below it if the user creates too many items.

To prevent this, you can limit the number of items the collection may contain and use a slightly more complicated (and dynamic) expression for the spacing:

Dynamic spacing expression for the text element:

Dynamic spacing expression for the path element:

Last updated