Available in: Axsy Mobile for Salesforce, Axsy Field Service, Axsy Public Sector, Axsy Retail Execution


Text styling and background colours can be configured and applied to Label-Value Widgets and the Table Widgets that are included in Flow-based dashboards in the Axsy Mobile App. 


Figure 1 - Dashboard with styling applied to Label-Value and Table Widgets



Label-Value Widget Styling

With Label-Value Widgets, the underlying Flow which populates the data in the widget should include individual Flow Output Variables - one for each value to be displayed in the Widget. To apply text styling or background colours to one of those output values, the Flow must include an additional Text Output Variable that contains the styling information for that output value using HTML-style formatting, e.g. "font-weight:bold;color:blue;background-color:aquamarine"


Associating the Flow Output Variable which defines the value to display and the Flow Output Variable with the styling information to use is done via a specific naming convention: The styling Variable must have the same API Name as the value Variable but with a suffix of _style applied.


For example, if there is a Flow Output Variable with API Name Key_KPI_Value that defines the value to display, then a Flow Output Variable with API Name Key_KPI_Value_style can be used to apply styling to that value.



Table Widget Styling

With Table Widgets, the underlying Flow which populates the data in the widget should include individual Flow Output Collection Variables - one for each column to be displayed in the Widget. To apply text styling or background colours to one or more cells in a column, the Flow must include an additional Text Output Collection Variable that contains the styling information for each column's cell with HTML-style formatting, e.g. "font-weight:bold;color:red;background-color:lightyellow". The styling Collection Variable should be the same size as the Collection Variable used for the column values - e.g. if the Table widget has 12 rows, both Collection Variables should be of size 12 - and a styling value of Empty String (Not Null) can be used for cells that should not having any styling applied.


Associating the Flow Output Collection Variable which defines the column values to display and the Flow Output Collection Variable with the styling information to use for each cell is done via a specific naming convention: The styling Variable must have the same API Name as the value Variable but with a suffix of _style applied.


For example, if there is a Flow Output Collection Variable with API Name Most_Popular_Products that defines the values to display for a column, then a Flow Output Variable with API Name Most_Popular_Products_style can be used to apply styling to each cell of that column.



Figure 2 - In the above example from the Salesforce Flow Designer, an Output Collection Variable with API Name koList and size 4 will have styling applied to its first 2 values and no styling applied to its third and fourth values.