This page is for application designers who want to create a true/false representation that is different to the default tick box.
By default, a true-false component shows a tick box that is
- ticked where a value is true
- unticked where a value is false.
To represent true/false values with different images
- Create two styles, one for the true state and one for the false state. In the style properties →
→ Basic Settings → Background Image, add or select an image to represent the state.Insert excerpt _property_tabs _property_tabs name basic nopanel true - Edit the true/false component properties.
- Switch to the
. In the Formatting Rules section, create a rule for the true state.Insert excerpt _property_tabs _property_tabs name design nopanel true - PhixFlow opens the formatting rule properties. in the Basic Settings section, set:
- Rule Expression to
'true'
. - In Style, select the style with the background image that represents the true state.
- Rule Expression to
- Save the "true" formatting rule.
- In Formatting Rules section, create another rule for the false state and set:
- Rule Expression to
'_form.value'
- In Style, select the style with the background image that represents the false state.
Stop if TrueInsert excerpt _tick _tick
- Rule Expression to
- Save the "false" formatting rule.
- Save the component.