Skip to content

Text#

"Screenshot showing a text icon."

Overview#

The Text widget displays static or dynamic text in a UI Page. The user can configure the widget to receive the value to display from an external data source or a static text message can be displayed on-screen.

Screenshot showing a text preview.

General Steps#

To use the Text widget in a UI Page, follow the steps below:

  1. In any UI Page in Build mode, select the Text from the widgets list located on the left side of the page; drag and drop to the desired place in the UI Page.
  2. Enter the Settings section of the widget through the three vertical dots.
  3. In the General tab, provide a name and a description for the widget. Use the toggle buttons to specify whether the widget should be visible, display the header, or allow full screen mode. Additionally, determine if the widget can be opened as an image in a new tab or exported as an image.

General Steps — screenshot: text general

Widget Customization#

  1. Optionally, in the Style tab, you can customize the appearance of the widget with the following properties:

    • Border Width - Choose from the available options to set the thickness of the border: Thinner, Thin, Medium, Thick, and Thicker.
    • Border Color - Select the color for the border using the color picker or by entering RGB coordinates.
    • Font - Choose the desired font type for the date and time displayed within the widget.
    • Font Size - Set the size of the text. Options include Extra Small, Small, Normal, Large, Extra Large, and Dynamic (which adjusts based on the widget's size).
    • Font Color - Select the color for the text using the color picker or by entering RGB coordinates.
    • Background Color - Choose the background color for the widget using the color picker or by entering RGB coordinates.
    • Horizontal Alignment - Align the text horizontally within the widget. Options include Center, Left, and Right.
    • Vertical Alignment - Align the text vertically within the widget. Options include Middle, Top, and Bottom.

    textStyle

  2. In the Setup tab, the widget can be configured through the following fields:

    • Text - What to display in the widget
    • Placeholder Text - If the user links the Text field to a dynamically source, a default message can be displayed when this source is empty.

    Screenshot showing widget settings for text display.

  3. Optionally, define the Links between this widget and other elements of the UI Page.

    textLinks

  4. By saving and closing the settings, the widget will be changed accordingly.