Properties

A property is a piece of data that can be attached to a component. The value can be displayed in the layout of the component or manipulated in a rule.

Types

Title text, descriptions etc. are typical uses of a text property.

An integer value (like 5) that could represent the cost of a card, for example.

A real number (like 2.5).

Boolean properties can be either true or false. These are typically used in rules, but they can also be used to switch on / off layers in the layout.

Image properties are useful if you intend to assign different images to different instances of a component.

Creating a property

A property is created from a component’s overview page.

1. 1
   Click on the Add Property button.
2. 2
   Choose the property type.
3. 3
   Rename the new property if desired.

Note that this merely declares that instances of this component will contain a particular property of a certain type. To actually set the values of the property, see the section below.

Assigning values

Each instance of a component can contain a different value for the same property.

1. 1
   Go to the Data section of a component.
2. 2
   Each row represents one instance of the component.
3. 3
   Each column represents a property that is a part of the component.
4. 4
   Assign values to the properties using the table.

Linking text

Properties can be displayed inside text boxes, including the middle of a sentence.

1. 1
   Create a text box.
2. 2
   Press the @ key to bring up a list of compatible properties.
3. 3
   Click on the property name to add it to the text box.

Linking images

When choosing the source of an image, the asset browser will display available image properties at the top.

1. 1
   Click on the asset browser after creating an image.
2. 2
   Click on an image property to make that the source of the image.
3. 3
   The image will now be replaced by whatever the image property is pointing to (which could be a different image for each instance of the component). See the section on assigning values to find out how to assign values to the image property.

Linking numbers

Number properties (both integers and reals) can be used to control various things on the layout. Pretty much any number field on the side panel can be linked to a property.

1. 1
   Hover over a number field on the side panel.
2. 2
   Click on the property icon that appears.
3. 3
   Choose the property to link to.
4. 4
   The value of the number field will now be determined by the property (which means that you can give each instance of the component a different value for this field).

Linking booleans

Boolean properties can be used to control layer visibility.

1. 1
   Go to the Layers tab.
2. 2
   Click on the layer visibility toggle.
3. 3
   Click on the property icon.
4. 4
   Choose the boolean property to link to.
5. 5
   The layer can now be hidden or shown per instance depending on the property’s value.