The Switch widget¶
Description¶
The switch widget shows two states (e.g. ON and OFF) and can toggle between them.
With a mapping it is possible to replace the 0/1 in the switch with custom texts or icons (e.g. On/Off instead of 0/1 or icons for window contacs, alarms, lights, etc.). The CometVisu comes with an extensive collecton of icons for many different usecases. Further information can be found at the mapping documentation.
and / or by the use of a styling it is possible to set colors (e.g. On in red and Off in green)
Of course it is possible to combine both at the same time:
Settings¶
For a general understanding of how the configuration files are structured and what elements and attributes are it is recommended to read this section first: Pages and structure of CometVisu.
The behaviour and appearance of the Switch widget can be influenced by using certain attributes and elements. The following tables show the allowed attributes and elements and their possible values. The screenshots show, how both can be edited in the editor.
Attributes underlined by ..... are mandatory, all the others are optional and be omitted.
Allowed attributes in the Switch-element¶
Element | Attribute | |||
---|---|---|---|---|
Name | Content | Description | ||
switch | styling | string | Change the color of the dispayed value depending on its value. See also Styling | |
mapping | string | Map the bus value to a different value, text or symbol for displaying. See also Mapping | ||
on_value | string | Value of the “on” state. Defaults to “1”. | ||
off_value | string | Value of the “off” state. Defaults to “0”. | ||
align | left, right or center | |||
flavour | string | Selection of a display variant. See also Flavour. | ||
bind_click_to_widget | true or false | use the whole widget area to react on click events | ||
class | string | Add this value to the CSS class so that it can be formated by a user provided style sheet. |
Allowed child-elements und their attributes¶
Element | Attribute | |||
---|---|---|---|---|
Structure | Name | Content | Description | |
|
colspan | decimal | Amount of coloumns this widget sould be wide. | |
colspan-m | decimal | Overrules the amount of coloumns on a medium screen. | ||
colspan-s | decimal | Overrules the amount of coloumns on a small screen. | ||
rowspan | decimal | Amount of rows this widget should be high. | ||
x | string | Horizontal position of the widget for 2D pages. | ||
x-s | string | Horizontal position of the widget for 2D pages on a small screen. | ||
x-m | string | Horizontal position of the widget for 2D pages on a medium screen. | ||
y | string | Vertical position of the widget for 2D pages. | ||
y-s | string | Vertical position of the widget for 2D pages on a small screen. | ||
y-m | string | Vertical position of the widget for 2D pages on a medium screen. | ||
z | string | Reserved for future use. | ||
width | string | Width for the widget for 2D pages. | ||
width-s | string | Width for the widget for 2D pages on a small screen. | ||
width-m | string | Width for the widget for 2D pages on a medium screen. | ||
scale | true or false | Enable/Disable scaling layout values relative to backdrop on 2d pages (default: true). | ||
scale-s | true or false | Enable/Disable scaling layout values relative to backdrop on 2d pages on a small screen (default: true). | ||
scale-m | true or false | Enable/Disable scaling layout values relative to backdrop on 2d pages on a medium screen (default: true). |
Element | Attribute | |||
---|---|---|---|---|
Structure | Name | Content | Description | |
|
name | string | ||
type | string | |||
flavour | string | Selection of a display variant. See also Flavour. | ||
color | string | |||
styling | string | Change the color of the dispayed value depending on its value. See also Styling | ||
class | string | Add this value to the CSS class so that it can be formated by a user provided style sheet. | ||
|
string | Text to display a label for the widget. |
Element | Attribute | |||
---|---|---|---|---|
Structure | Name | Content | Description | |
|
transform | string | ||
mode | disable, read, write or readwrite | |||
variant | string | |||
format-pos | decimal | |||
|
string | The GA (like: 12/0/7) for KNX-backends or the item name for openHAB-backend |
Examples¶
It is possible to manually edit the visu_config.xml and add an entry for the Switch widget.
Caution
Make sure that you only use UTF-8 encoded characters by settings the encoding in your XML-editor to UTF-8 mode!
...
<meta>
<mappings>
<mapping name="OnOff">
<entry value="0">O</entry>
<entry value="1">I</entry>
</mapping>
</mappings>
<stylings>
<styling name="GreyGreen">
<entry value="0">grey</entry>
<entry value="1">green</entry>
</styling>
</stylings>
</meta>
...
<switch mapping="OnOff" styling="GreyGreen">
<layout colspan="3"/>
<label>Switch</label>
<address transform="DPT:1.001" mode="readwrite">0/0/0</address>
</switch>
Footnotes
[1] | The simple view might not show everything. To see all elements/attributes use the expert view. |