Calculated values and conditional logic

The Expression Builder dialog can be used to create conditional logic, calculated values, error messages or for simulating a database. This dialog opens up either when you want to add a condition to an event or when you want to create a set value action with a calculated value.

The top part of the dialog displays the expression or condition that is being built. If a condition is being built, the expression would be between two brackets and preceded with the word ‘when’. That is a visual help to highlight that the result of whatever expression is built there, it has to resolve to either true or false. Not a number or a text.

Besides defining conditions, the Expression Builder dialog can also be used to define calculated values for the following event action types: Set Value, Rotate, Resize and Move.

add value expression

In order to use that dialog to create a condition, click on the “Add condition” link that appears in the Events palette after creating an event.
add condition

Expression Builder overview

condition builder explained

  1. The expression: this is where you can build an expression by a combination of values and functions.
  2. Functions: drag from this list of functions to the area in the top to add it to your expression. Functions can manipulate different values or results of other functions to obtain a different value. For instance, an addition function can take to numbers and return the sum of both.
  3. Constants: these are a set of calculated values that can be used in the expressions. For instance, one constant gives you the current size of the window at the moment the expression is evaluated.
  4. Screen: displays the contents of the current screen. You can drag any element from the screen to the expression and, once in the expression, use different types of properties of that element as values in the expression.
  5. Variables: lists all the variables in the prototype. Variables can be dragged to the expression and will use the current value of that variable at the moment the expression is evaluated.
  6. Data Masters: lists the Data Masters and attributes of that prototype. Both can be used in expressions especially with some special functions like ‘Filter’.

Now let’s get into the specifics of each of those sections.

Functions in the expression builder

Functions are grouped by the type of value that they return. They’re organized in ‘Number’, ‘Text’, ‘Logic’ (meaning true/false) and ‘Data’.

Number

Functions in this group will return a number as a value.
number functions

  • Plus: Takes two numbers and returns the result of adding them.
  • Addition example

  • Minus: Takes two numbers and returns the result of subtracting the second from the first
  • Subtract Example

  • Multiply: Takes two numbers and returns the result of multiplying them.
  • Multiply example

  • Division: Takes two numbers and returns the result of dividing the first by the second number.
  • Division example

  • Max: Returns the greater of two numbers
  • Max example

  • Min: Returns the smaller of two numbers
  • Min Example

  • Average: Returns the average value of two numbers
  • Average Example

  • Absolute: Returns a negative value as positive.
  • Absolute Example

  • Round: Rounds a number to the number of decimals specified in the second space
  • Round Example

  • Percentage: Returns the percentage of the first number relative to the second
  • Percentage Example

  • Sqrt: Returns the square root of the number entered.
  • Square root Example

  • Mod: Returns the remainder after dividing two numbers.
  • Mod Example

  • Count: Returns the number of characters in a text.
  • Count Example

  • Index of: Returns a number that is the position of the second text within the first. If the second text is not found in the first, it will return -1
  • Index Example

  • Count (data count): Returns the number of instances of a value included in a data set.Data Count Example
  • Sum: The sum of the values within a data set.Data Sum Example
  • Average: Determines the average value of a data set
  • Max: Determines the greatest number value from within a data set
  • Min: Determines the smallest number value from within a data set

Text

These functions return a text as a combination of other texts or other criteria.
text functions

  • Concat (Concatenate): Combines two texts into one single text.

Concat Example

  • Substring: Extracts a piece of text from a text given two positions. The first space is the text, second is the starting position, third is the ending position.

Substring Example

  • Upper case: Converts the text to uppercase
  • Lower case: Converts the text to lowercase
  • First upper: Capitalizes the first character
  • Select: Given a Data Master record, returns the value of one of the attributes of that record. If the first parameter holds a collection of records, then it will return all the values of the attribute in those records separated by commas.
    • The first space represents the record to select from (a row in a Data Master, a row stored in a Variable, or a row of a Data List or Data Grid).
    • The second space defines the Data Master attribute to select.

    Select Example

  • Select distinct: Same as ‘Select’ but if the result is a list of values, it will remove the duplicates.Select Example

Logic

Return true or false given two values. They’re mainly used to build conditions. They work with numbers, texts and many other type of values.
comparators

  • Equals: Returns true if both vales are the same.
  • Not equal: Returns true if the values are different.
  • Greater: Returns true if the value on the left is greater than the one on the right.
  • Less: Returns true if the value on the left is smaller than the one on the right
  • Greater or equal: Returns true if the value of the number on the left is greater than or equal to the number on the right
  • Less or equal: Returns true if the value of the number on the left is smaller than or equal to the number on the right
  • And: Returns “true” if all terms in a condition or value are true
  • Or: Returns “true” if any term is true
  • Not: Returns “true” if any term is not true
  • Exclusive or: Returns “true” only if one of the terms is true
  • Regular expression: Checks if a value matches a regular expression
    Regex Example
  • Has: Returns true if the text in the second value is present in the text of the first value.
    Contains Example
  • Intersect: Determines if two elements are touching
  • Contains: Determines if an element contains another

Data

Data functions relate to data within Data Masters, Data Grids and Data Lists and other UI elements that contain data, such as Select Lists:
data functions

  • Filter: Data function that returns a list of rows or records according to a filter condition.
    • The first space represents the data to select from (a Data Master, Variable, Data List, or Data Grid).
    • The second space is the filter condition. Specify the records that should be included in the filter using logic functions or text.

    Filter Example

  • Filter distinct: Finds and filters duplicate values from within a data set.Filter Distinct Example
  • Add (data plus): Combines two data sets together.Data Plus example
  • Remove (data minus): Removes the second data set from the first.Data Minus Example
  • Sort: This function returns a list of sorted data. A drop-down appears to choose whether to list the data in ascending or descending order. Two spaces of data are shown in the expression.
    • The first represents a set of data to be sorted (e.g. a Data List row).
    • The second represents the data that the first will be sorted by (e.g. a Data Master field)

    Sort Example

Constants in the expression builder

Constants are divided into two categories: Constants and Regular Expressions.

Constants

Standalone constants, such as a text, the date and time, screen properties and mouse cursor position can be used to define conditions and create values.
constants

  • Text: Input any (and an unlimited number of) characters
  • Date: Displays a date selector
  • System date: The actual date at the moment in simulation when that expression is being evaluated
  • System time: The actual time at the moment in simulation when that expression is being evaluated
  • Random: Generates a random number between 0 and 1 (with decimals, like 0.97977 for instance)
  • Window width: The width of the screen at the moment when that expression is being evaluated
  • Window height: The height of the screen at the moment when that expression is being evaluated
  • Window scroll X: The position in pixels of the horizontal scroll bar at any given moment
  • Window scroll Y: The position in pixels of the vertical scroll bar at any given moment
  • Cursor X: The X coordinate of the cursor at a given moment
  • Cursor Y: The Y coordinate of the cursor at a given moment

Regular Expressions

Regular expressions are used to ensure that values meet ‘rules’ (e.g. to ensure that a zip code is correct in a registration form). They need to be used in combination of the ‘Regular Expression’ function located in the ‘Logic’ section.
regular expressions

  • Number: Describes a pattern to match numbers, even with decimals (separated by ‘.’ or ‘.’)
  • Email: Describes a pattern to match email addresses (must contain a username, “@”, a valid server and “.com”)
  • Percentage: Describes a pattern to match percentages, with or without decimal points of up to two decimal places
  • Money: Describes a pattern for numbers that represent money. Decimal points and currency signs are optional
  • Postal code: Describes a pattern to match postal codes
  • Credit card: Describes a pattern to match numbers that are credit cards
  • Phone: Describes a pattern that match any number between six and 10 digits (with or without spaces and/or dashes)
  • URL: Describes a pattern to match web addresses

UI element options in the expression builder

Drag and drop UI elements from the current screen to the expression to build a condition or value:
screens
Then, choose which attribute of the element is to be used in the expression. Choose from the following options:

  • Value: The current selected value of an element on the current screen. Almost all widgets will include this option
  • Pos.X relative: The X coordinate of the selected element’s position relative to its closest parent container
  • Pos.X absolute: The X coordinate of the selected element’s position relative to the screen
  • Pos.Y relative: The Y coordinate of the selected element’s position relative to its closest parent container
  • Pos.Y absolute: The Y coordinate of the selected element’s position relative to the screen
  • Width: The width of the element in pixels
  • Height: The height of the element in pixels
  • Angle: The rotation angle of the element in degrees
  • Is visible: Visible only if the element is visible
  • Area: The measurements of an element (see Area functions above)
Note: both the X and Y positions, absolute or not, refer to the top-most and left-most positions of the element respectively

Variables in the expression builder

You can also drag and drop variables to the expression, and use them to create advanced conditions or values that can be shared between different screens in a prototype.
Variables in the expression builder
You can learn more about using variables in your prototypes here.

Data masters in the expression builder

Drag and drop entire data masters, or data master fields into the expression to create filters, select specific records, and other operations involving data masters.
Data masters in the expression builder
Learn more about using data in Justinmind here.