OH3 - Widgets Background

Allgemeine Fragen rund um die "Smart Home" Hardware/Komponenten

Moderatoren: seppy, udo1toni

yoshi98
Beiträge: 24
Registriert: 3. Jun 2018 09:04

OH3 - Widgets Background

Beitrag von yoshi98 »

Hallo Gemeinde,

stehe vor einem Rätsel. Ich möchte bei meinen Widgets die Hintergrundfarbe in Abhängigkeit vom Status ändern. Bei Status-Ausgaben ON/OFF klappt das wie folgt:

Code: Alles auswählen

background: '=items[props.item].state == "ON" ? "green" : "red"'
Bei Status-Ausgaben OPEN/CLOSED klappt es nicht:

Code: Alles auswählen

background: '=items[props.item].state == "OPEN" ? "green" : "red"'
Kann mir jemand sagen warum?

Schönes Wochenende!
2x Raspberry Pi 3 / Openhabian / Openhab 2 / Openhab 3
Homematic / CCU3 / Hue / Sonos / Alexa

Benutzeravatar
peter-pan
Beiträge: 2564
Registriert: 28. Nov 2018 12:03
Answers: 25
Wohnort: Schwäbisch Gmünd

Re: OH3 - Widgets Background

Beitrag von peter-pan »

Ich bin kein Kenner von JS bzw. Custom-Scripts/Custom-Widgets, aber wenn ich das mit einem Standard-Widget probiere, funktioniert das sowohl mit ON/OFF als auch OPEN/CLOSED.

Code: Alles auswählen

component: oh-label-card
config:
  title: Fenster Status
  item: Socket_Fritz_03_locked
  background: '=items.Socket_Fritz_03_locked.state == "CLOSED" ? "blue" : "red"'
Deshalb kann ich nur vermuten, dass entweder der Status (OPEN/CLOSED) nicht passt, oder der verwendete Ausdruck irgendwie nicht richtig ist.

Wie sieht denn das Widget aus (Yaml) ?
Pi5/8GB(PiOS Lite 64-bit(bookworm)/SSD 120GB - OH4.1.1 openhabian

yoshi98
Beiträge: 24
Registriert: 3. Jun 2018 09:04

Re: OH3 - Widgets Background

Beitrag von yoshi98 »

Das funktionierende Widget sieht so aus:

Code: Alles auswählen

uid: widget_anwesenh_telefon
tags: []
props:
  parameters:
    - description: A text prop
      label: Header
      name: header
      required: false
      type: TEXT
    - context: item
      description: Anwesenheit aktuell
      label: Item
      name: item
      required: true
      type: TEXT
    - description: Icon eingeben
      label: Icon
      name: icon
      required: false
      type: TEXT
    - context: item
      description: Item Letzte Anwesenheit
      label: Item
      name: item2
      required: true
      type: TEXT
  parameterGroups: []
timestamp: Mar 24, 2021, 7:14:44 PM
component: oh-label-cell
config:
  title: =props.header
  item: =props.item
  trendItem: =props.item
  icon: =props.icon
  footer: = "Letzte Anwesenheit " + items[props.item2].displayState
  expandable: false
  style:
    background: '=items[props.item].state == "ON" ? "green" : "red"'
Die Variante für den Status der Türen ist davon abgeleitet:

Code: Alles auswählen

uid: widget_tuer_fenster_offen
tags: []
props:
  parameters:
    - description: A text prop
      label: Header
      name: header
      required: false
      type: TEXT
    - context: item
      description: TFK Kontakt
      label: Item
      name: item
      required: true
      type: TEXT
    - context: icon
      description: Icon eingeben
      label: Icon
      name: icon
      required: false
      type: TEXT
  parameterGroups: []
timestamp: Mar 27, 2021, 1:40:53 PM
component: oh-label-cell
config:
  title: =props.header
  item: =props.item
  icon: =props.icon
  expandable: false
  style:
    background: '=items[props.item].state == "OPEN" ? "green" : "red" '
Und die funktioniert nicht. Die Farbe reagiert nicht.
2x Raspberry Pi 3 / Openhabian / Openhab 2 / Openhab 3
Homematic / CCU3 / Hue / Sonos / Alexa

Benutzeravatar
peter-pan
Beiträge: 2564
Registriert: 28. Nov 2018 12:03
Answers: 25
Wohnort: Schwäbisch Gmünd

Re: OH3 - Widgets Background

Beitrag von peter-pan »

Leider haben bei mir beide Widgets nicht funktioniert.
Ich habe aber einfach mal Folgendes gemacht. Ich habe mir eine "Label-Cell" angelegt und die sieht so aus:

Code: Alles auswählen

component: oh-label-cell
config:
  color: '=items.HmIP_SWDO_I_E754_1STATECONTACT.state == "OPEN" ?  "orange"  :  "green"'
  header: kopf
  icon: oh:window
  item: HmIP_SWDO_I_E754_1STATECONTACT
Dabei habe ich jetzt nicht noch mit verschiedenen Icons und Icon-Farben, etc herum experimentiert. Sondern mich auf die "Hintergrundfarbe" beschränkt. Und wie du schon erkennen kannst, wird hier der Parameter "color" benutzt.

Das nun in dein Widget umgesetzt sieht dann so aus:

Code: Alles auswählen

uid: widget_tuer_fenster_offen
tags: []
props:
  parameters:
    - description: A text prop
      label: Header
      name: header
      required: false
      type: TEXT
    - context: item
      description: TFK Kontakt
      label: Item
      name: item
      required: true
      type: TEXT
    - context: icon
      description: Icon eingeben
      label: Icon
      name: icon
      required: false
      type: TEXT
  parameterGroups: []
timestamp: Mar 27, 2021, 6:36:00 PM
component: oh-label-cell
config:
  title: =props.header
  item: =props.item
  icon: =props.icon
  color: '=items[props.item].state == "OPEN" ? "green" : "red" '
 
... und damit klappt's dann. Hier heisst das Zauberwort wohl "color" statt "background".
Pi5/8GB(PiOS Lite 64-bit(bookworm)/SSD 120GB - OH4.1.1 openhabian

yoshi98
Beiträge: 24
Registriert: 3. Jun 2018 09:04

Re: OH3 - Widgets Background

Beitrag von yoshi98 »

Danke, aber klappt leider auch nicht. Was verwendest Du für Kontakte? Ich habe Homematic und irgendwie gibt's da immer Besonderheiten. Meist müssen die ausgegebenen Werte irgendwie gecastet werden, aber nirgends steht wie.
2x Raspberry Pi 3 / Openhabian / Openhab 2 / Openhab 3
Homematic / CCU3 / Hue / Sonos / Alexa

yoshi98
Beiträge: 24
Registriert: 3. Jun 2018 09:04

Re: OH3 - Widgets Background

Beitrag von yoshi98 »

Nachdem ich nun noch einen Versuch unternommen habe, Deinen Code in ein neues Widget zu kopieren funktioniert es bedingt. Die Farben sind - obwohl gleicher Name - andere. Faszinierend! ;)
2x Raspberry Pi 3 / Openhabian / Openhab 2 / Openhab 3
Homematic / CCU3 / Hue / Sonos / Alexa

yoshi98
Beiträge: 24
Registriert: 3. Jun 2018 09:04

Re: OH3 - Widgets Background

Beitrag von yoshi98 »

Insofern @peter-pan noch einmal vielen Dank. Ich weiß zwar nicht, warum es so funktioniert, aber es ist für mich eine brauchbare Lösung.
2x Raspberry Pi 3 / Openhabian / Openhab 2 / Openhab 3
Homematic / CCU3 / Hue / Sonos / Alexa

Benutzeravatar
peter-pan
Beiträge: 2564
Registriert: 28. Nov 2018 12:03
Answers: 25
Wohnort: Schwäbisch Gmünd

Re: OH3 - Widgets Background

Beitrag von peter-pan »

Ich habe als Test-Item auch einen HMIP-SWDO-Fenster-Kontakt benutzt. Das Widget funktioniert mit beiden Typen (String- u- Kontalt-Item).
Yaml-Code String:

Code: Alles auswählen

component: widget:widget_tuer_fenster_offen
config:
  header: =items.HmIP_SWDO_6AF9_1STATE.displayState || items.HmIP_SWDO_6AF9_1STATE.state
  item: HmIP_SWDO_6AF9_1STATE
  icon: oh:window
Yaml-Code Contact:

Code: Alles auswählen

omponent: widget:widget_tuer_fenster_offen
config:
  header: =items.HmIP_SWDO_6AF9_1STATECONTACT.displayState
  item: HmIP_SWDO_6AF9_1STATECONTACT
  icon: oh:window
und das Ergebnis als Screen-Shot:
label.jpg
Also bei mir sieht das gut aus: Hier nochmal mit unterschiedlichem Status:
label1.jpg
Pi5/8GB(PiOS Lite 64-bit(bookworm)/SSD 120GB - OH4.1.1 openhabian

Benutzeravatar
peter-pan
Beiträge: 2564
Registriert: 28. Nov 2018 12:03
Answers: 25
Wohnort: Schwäbisch Gmünd

Re: OH3 - Widgets Background

Beitrag von peter-pan »

Hier noch ein Link zu noch mehr Farben: Da wirst du sicherlich fündig ;)
Pi5/8GB(PiOS Lite 64-bit(bookworm)/SSD 120GB - OH4.1.1 openhabian

yoshi98
Beiträge: 24
Registriert: 3. Jun 2018 09:04

Re: OH3 - Widgets Background

Beitrag von yoshi98 »

Danke!
2x Raspberry Pi 3 / Openhabian / Openhab 2 / Openhab 3
Homematic / CCU3 / Hue / Sonos / Alexa

Antworten