Display widgets
The App Builder provides a diverse range of display widgets to visualize data in any form. Display widgets are closely aligned with function output, as they commonly receive data to be visualized and other properties to be set from a function.
Display widgets
The following display widgets are available:
Chart: Classic line, bar, area, or scatter chart
Circular gauge: Visualizes a value and sub-value in circular form
Data grid: Allows visualizing database tables
Linear gauge: Visualizes a value and sub-value in linear form
Map: Marks geodata in an interactive map
Media view: Allows the dynamic display of media such as images
Progress bar: Visualizes the percentage or absolute progress of a process or time
Sparkline: Small line chart without axes or coordinates
Status lamp: Displays the status as a color, e.g., that of a function
Toast: Time-limited display of notifications
Value box: Flexible display of arbitrary data or a data point
Set property with application logic
Data and behavior properties of display widgets must be set from one or more functions in the application logic. To enable this data transfer, a display widget must be linked with the output box of a function or with a modifier. It's important to note that display widgets have the flexibility to be linked with multiple functions simultaneously.
Link widget and function
To link a display widget with an output box or a modifier:
Select a display widget in the UI editor.
Drag and drop an output/modifier onto the selected widget.
When the link is established, the output/modifier indicates it with stating the property to be set.
Click the x next to the text to unlink an output widget from an output/modifier.
Properties
Most display widgets primarily provide a main data property. However, certain display widgets go beyond, allowing visualization of additional data properties and offering behavior properties to manipulate. To modify the property set by the logic, follow these steps:
Link widget and function as explained above.
Click on the property in the linked output/modifier to open a list of available properties.
Select the desired property from the list.
Last updated