Home Elements Boards Recipes

DisplayTextBox Element

The DisplayTextBoxElement allows showing a text on the display in a rectange area at a specified position as text including a prefix and postfix. The value can be changed by using an action.

In contrast to the DisplayTextElement the DisplayTextBoxElement can draw a specific fill color and border and also allows right and center aligned text on the configuration by using different positions and fontsize.

The DisplayTextBox is included in the collection of Display-Draw elements and can be used on pixel based displays only.

Element Configuration

The following properties are available for configuration of the element.

clear – This property set to any value will remove the text from the display.

prefix – This text is always send to the display as a prefix to the value.

postfix – This text is always send to the display as a postfix to the value.

fontsize – This is the fontsize to be used. Do not specify or use 0 to get the default/smallest fontsize. For the OLED drivers the font sizes 10, 16 and 24 are supported.

Be aware that the positions and fontsize of the configurations must match to the capabilities existing display.

The DisplayOutputElement captures the parameters for defining a visual Element on the display. Tis is common for multiple Elements even when they are not used by the element.

The following properties are available for configuration:

x – Specifies the x position of the Element.

y – Specifies the y position of the Element.

w or width – Specifies the width of the Element.

h or height – Specifies the height of the Element.

align – The alignment of the text. Possible values are “left” (default), “center” and “right”. This configuration is used by the DisplayTextBox Element only

fontsize – Specifies the size of the text used for drawing the Element. This configuration is used by the DisplayTextBox Element only

stroke or color – Specifies the stroke color of the Element. When no color is specified on the element the default stroke color from the display is used.

fill or background – Specifies the background color of the Element. When no color is specified on the element the default fill color from the display is used.

border – Specifies the border color of the Element. When no color is specified on the element the default color from the display is used.

value – Specifies a value for the Element. This is used for some Output Elements only.

clear – The value is cleared.

From the base element implementation the following properties are available for configuration:

title – Caption text for the element. Used by the element specific cards on the dash boards.

description – A line of text that gives a short description of the device used in the web UI.

room – The location of the device.

loglevel – This property holds the element specific log level. The default value is LOGGER_LEVEL_ERR == 1.

startup – This property can be used to start the element using a different initialization phase. Possible values are “sys”, “net”, “time”. See The Startup sequence.

Element Actions

The following actions can be sent to the element:

value – This value is sent to the display including prefix and postfix texts.

clear – The value is cleared and the display is updated by sending prefix and postfix texts.

redraw – The value is sent to the display including prefix and postfix texts.

Configuration Example

This example shows how to configure this element:

{
  "displaytextbox": {
    "val": {
      "x": 0,
      "y": 1,
      "prefix": "val=",
      "postfix": "",
      "description": "Display the value"
    }
  }
}

The value property corresponds to the shown text. Using the browser you can set the value using http://homeding/$board/displaytext/val?value=hello

The clear property can be used to remove the text. http://homeding/$board/displaytext/val?clear=1

Element State

The following properties are available with the current values at runtime

active - Is set to true when the element is active.

value - Current output value of the element.

Example State

{
  "displaytextbox/val": {
    "active":"true",
    "value":"10"
  }
}

See also

Tags

Element Display