Touchscreens can be accessed in grid view from the Instance types perspective under the Touchscreen tab. This view functions the same as the push buttons view except with the addition of an icon field and two colour fields - one for font colour and one for icon colour. The combination of these fields along with the label for the instance make up the appearance of the button that appears on the touchscreen device.

There is also a view for older touchscreens which don't support the new widgets under the Touchscreen (legacy) tab which will only appear if there is an older touchscreen on the site.

Editing widgets

Widgets is where you get the most value out of your touchscreen. Unfortunately you are unable to edit these on legacy touchscreens.

Position

The position field dictates where your widgets are positioned on the touchscreen. It is in the format of X.X.X (parent instance number, screen index, row index). If the parent instance number is a P, that means it is a parent, otherwise it will display the instance number of the parent that the row is a child to.

The touchscreen view is, by default, ordered by position which will display them in order of the screen and row, but if the row has any children, they will be displayed directly underneath that row. This is so that you can view the pages easily.

If you want to display certain pages or hide all children of the pages, then you can do so from the right-click menu. This is handy for viewing the context of pages you care about.

Widgets

The widgets column is where you can start configuring what the actual row in the touchscreen will look like. The cell will display the number of widgets currently on the row. You can have up to 4 widgets per row. If the cell says 0 widgets then it will use the legacy values to generate a row using the icon, label and colours from the instance.

The dropdown itself will offer you available templates for the row as well as a button that will take you to the advanced widget editor to be able to fully customise your widgets. If there is a template that doesn't exist that you think would be useful, then feel free to contact support with your template suggestion.

Selecting a template will display instructions that must be followed in order for the template to work properly. It will set up as much as it can for you including the widgets and the applications, but they will still require extra steps such as targets set correctly.

LED Configuration

Per instance there is an LED per widget (4 per instance). Each of these LEDs can have a unique behaviour. LED 1 to 4 directly correlate to widgets 1 - 4 left to right on the instance row. For general LED configuration options, please see Led Configurations.

It is possible to disable LED behaviour for a widget by clicking the check box to the left. Where a LED behaviour has been given for a widget that is not used, the LED behaviour will be applied but will not affect the device.

LED Colour is also configured in a similar way where each LED of each instance can have a unique LED colour.

IMPORTANT

The default widget is made up of two widgets, an icon and a label. Therefore for both of these default widgets to perform default behaviour, LED1 and LED 2 for that instance must be enabled and configured for the same behaviour.

Widget editor

If a template does not fit your needs or you just want to create some custom widget designs, then clicking the Open widget editor button will take you to a page where you can make advanced customisations.

Opening the widget editor will display all widgets for that page, but will only have the one you selected highlighted. If you see blank areas, that means you don't have an instance in that position. You can still edit any of the widgets you see on the page, even if they are not highlighted.

If you want more than one highlighted, you can right-click on multiple in the grid view and, as long as they are all on the same page, can click Open widget editor and it will highlight all of the ones that you have selected.

The same template options that are in the grid view are also available here for each of the available rows. There is another option here at the top left which is a page template. This will apply a template to each row on the screen to make a complete page of widgets that fit together. The widgets can be edited after a template is applied. Instructions for each row's template will also appear on the right side of the screen when no widget is selected.

Clicking on any of the widgets on the screen will open the settings on the right side of the screen. The currently selected widget will have a yellow highlight on the screen. Widgets have many settings. Each type also has particular settings that can be set for that type so if  you change types make sure you pay attention to the new settings for that type. Most of the settings will be reflected immediately in the preview screen. Settings such as the On state colour and Pressed background colour will not appear in the preview.

A brief overview of the common settings are below:

• Widget type
  • The type of widget to be displayed
• Weight

  • A weighted value to determine how much space the widget takes up. The weight of all widgets should add up to 4 in total.

    • e.g. Having 3 widgets with weights of 1, 2 and 1 will make the widgets take up 25%, 50% and 25% in width respectively.
• Alignment
  • How the content in the widget is aligned
• Action
  • Enabled: Whether the button does something.
  • Associated type: How the button is interacted with.
    • Push button 1-4: Generally used for push button application types (toggle, dimmer etc) for icon and label widget types
    • Raw input value: Generally used for slider and number display widget types
    • RGBWAF + intensity: Generally used for icon or label colour picker widget types
    • Text display: Generally used only for the text display widget type
    • Go to child page: Should only be used if you have children set up for the page as it loads up the child page
  • Behaviour: Determines how values are sent from the screen to the application
    • Use screen behaviour: Does whatever the default behaviour is as dictated by the associated type
    • Override with value: Sends a specific value
    • Increment by value: Increment the current value by a specified amount without the bounds of the min and max
    • Decrement by value: Decrement the current value by a specified amount without the bounds of the min and max
• Borders
  • Top/right/bottom/left: Toggles whether the border is visible or not
  • Colour type: Type of colour
    • Default colour: The default colour value determined by the touchscreen
    • Solid custom colour: Takes the value in the Colour value field
• Pressed background colour
  
  • This is the colour that the background of the widget turns when you physically press the button
  • Colour type: Type of colour
    • Default colour: The default colour value determined by the touchscreen
    • Solid custom colour: Takes the value in the Colour value field
• On state colour
  
  • This is the colour that the borders of the widget turns when the LED type, if configured, matches the criteria and is determined active
  • Colour type: Type of colour
    • Default colour: The default colour value determined by the touchscreen
    • Solid custom colour: Takes the value in the Colour value field
• Input application
  • Apply input application configs to all profiles: Whether the settings should be applied to all profiles. This will be unticked if the settings between your profiles are different but generally you'll want to tick this so that all of the settings match
  • Type: The type of behaviour for the button
  • Command 1/2: A custom command or arc level to send when the button is toggled. This is only available for custom types
  • Override: The type of override to apply to the target
  • Apply override: When to apply the override, if set
  • Override time: How long to apply the override for, if set
  • Scenes: What scenes the application is active in
• LED application
  • Apply LED application configs to all profiles: Whether the settings should be applied to all profiles. This will be unticked if the settings between your profiles are different but generally you'll want to tick this so that all of the settings match
  • Type: The type of behaviour to match against the target to determine if the LED should be active
  • System variable: The system variable number to check the value against. Available only if the type is a system variable type
  • Value: The system variable value to check against. Available only if the type is a system variable type
  • Condition: Whether to check if the override is active or inactive. Available only if the type is an override type
  • Action: The action type to check the override against. Available only if the type is an override type
  • On state colour: The colour that the borders will go if the colour type is the default colour

Each widget type will also have sections for its own settings. When you are happy with the look and functionality of your widgets, click the Save changes button down the bottom right. Any changes you make up until now are not saved anywhere. If you are unhappy with your changes and want to get rid of them, click the Discard changes down the bottom right instead.