Umschalter ui-switch
Demo Ausprobieren Fügt der Benutzeroberfläche einen Umschalter hinzu.
Eigenschaften
| Prop | Dynamic | Description |
|---|---|---|
| Gruppe | Definiert, in welcher Gruppe des UI-Dashboards dieses Widget gerendert wird. | |
| Größe | Steuert die Breite des Buttons in Bezug auf die übergeordnete Gruppe. Der Maximalwert ist die Breite der Gruppe. | |
| Beschriftung | ✓ | Der Text, der innerhalb des Buttons angezeigt wird. HTML-Inhalt ist erlaubt. |
| Layout | ✓ | Definiert, wie die Beschriftung und der Schalter angeordnet sind. Benutzer können zwischen verschiedenen Layout-Optionen wählen, wie z.B. Elemente links ausrichten, links umgekehrt, gleichmäßig verteilen oder gleichmäßig verteilen, aber in umgekehrter Reihenfolge. |
| Klickbar | ✓ | Der klickbare Bereich (der zum Umschalten des Schalters führt). |
| Ein-Icon | ✓ | Wenn bereitgestellt, wird dieses Material Design Icon den Standardschalter im "Ein"-Zustand ersetzen. Es ist nicht notwendig, das mdi-Präfix einzuschließen. |
| Aus-Icon | ✓ | Wenn bereitgestellt, wird dieses Material Design Icon den Standardschalter im "Aus"-Zustand ersetzen. Es ist nicht notwendig, das mdi-Präfix einzuschließen. |
| Ein-Farbe | ✓ | Wenn mit einem Icon bereitgestellt, wird diese Farbe für das Icon im "Ein"-Zustand verwendet. |
| Aus-Farbe | ✓ | Wenn mit einem Icon bereitgestellt, wird diese Farbe für das Icon im "Aus"-Zustand verwendet. |
| Durchreichen | Wenn aktiviert, wird das Widget die Eingabenachricht an die Ausgabe weiterleiten. | |
| Indikator | Nur verfügbar, wenn "Durchreichen" auf false gesetzt ist. Definiert, ob der Schalter den Status der Ausgabe oder eine bereitgestellte Eingabe über msg.payload anzeigt. | |
| Ein-Payload | Der Typ & Wert, der in msg.payload ausgegeben wird, wenn der Schalter eingeschaltet wird. | |
| Aus-Payload | Der Typ & Wert, der in msg.payload ausgegeben wird, wenn der Schalter ausgeschaltet wird. |
Dynamische Eigenschaften
Dynamic properties are those that can be overriden at runtime by sending a particular msg to the node.
Where appropriate, the underlying values set within Node-RED will be overriden by the values set in the received messages.
| Prop | Payload | Structures | Example Values |
|---|---|---|---|
| Klasse | msg.ui_update.class | String | |
| Beschriftung | msg.ui_update.label | Boolean | |
| Layout | msg.ui_update.layout | String | |
| Klickbar | msg.ui_update.clickableArea | String | |
| Durchreichen | msg.ui_update.passthru | Boolean | |
| Indikator | msg.ui_update.decouple | Boolean | |
| Ein-Farbe | msg.ui_update.oncolor | String | |
| Aus-Farbe | msg.ui_update.offcolor | String | |
| Ein-Icon | msg.ui_update.onicon | String | |
| Aus-Icon | msg.ui_update.officon | String |
Steuerungen
| msg. | Example | Description |
|---|---|---|
| aktiviert | true | false | Ermöglicht die Steuerung darüber, ob der Schalter über die UI umgeschaltet werden kann. |
Beispiel
Beispiel von gerenderten Schaltern in einem Dashboard.