Logical operators

Logic functions are incredibly powerful – especially for creating templates that ensure compliance with your brand design guidelines. Style guides typically define rules, which, in the case of an individual template, can be represented as logical expressions for certain properties. If these expressions are written using logic functions, users do not have to worry about the style guide, as compliance is automatic.

To make this less abstract, let's look at another example:

Suppose you want to give the user the option to choose between two color themes. Very often, you don't want the users to choose the fill colors themselves, but instead you want to provide them with a discrete (brand consistent) selection. However, in the example template shown in this documentation, different (shades of) colors are used in combination. Here is how two different color themes might look like:

Although three different fill colors must be defined for each color scheme, the user should be able to make this selection using a single input field, like this:

So how is this done?

1. The Select input field is connected to and controls the fill color of the circle.
2. The fill colors of the curved “#Bluepic-STUDIO” text and the background are dynamic expressions that output a specific blue or yellow shade depending on the fill color of the circle.

Take a closer look at the expression of the fill color of the background rectangle:

The expression is this:

SWITCH(circle1_fill, "#FFBB34", "#FFCC68", "#457DED", "#739EF1")

A SWITCH-function is a logical operator. Its arguments follow a specific pattern: the first argument is compared with a series of value pairs – or, to be more precise, it is compared with the first value of the value pairs. If the first value of the pair matches the initial argument, the second value of the pair is returned as the output of the function. Here is a representation of the expression that is easier to interpret:

SWITCH(color_of_the_circle, blue, light_blue, yellow, light_yellow)

In simple terms, this expression means the following: if the color of the circle is blue, the output is light blue; if it is yellow, the output is light yellow.

An IF-function (if-else statement) could also have been used, but the advantage of the SWITCH function is that it can handle more than two color themes. You could easily add another option like this:

SWITCH(color_of_the_circle, blue, light_blue, yellow, light_yellow, red, light_red)

The expression for the “#Bluepic-STUDIO” text works in the same way (with dark color shades).