CUSTOM WIDGET FÜR SHC UND MEHR

FMMephisto · 13. Februar 2023

Hi!

Habe das SHC-Widget noch ein wenig angepasst.

Jetzt sehen auch die Props-Einstellungen besser aus:

Code

uid: Livisi_SHC-Card
tags:
  - Livisi
  - System
props:
  parameters:
    - label: Titel
      name: title
      required: false
      type: TEXT
    - label: Bild (Daymodus) ohne Suffix in static/icons
      required: false
      type: TEXT
    - label: Bild (Darkmodus) ohne Suffix in static/icons
      name: bild_night
      required: false
      type: TEXT
    - context: item
      label: Item für Betriebsstatus
      name: item_1
      required: false
      type: TEXT
    - label: Betriebsstatus F7-Icon (ohne F7:)
      name: icon_1
      required: false
      type: TEXT
    - label: Betriebsstatus TEXT
      name: text_1
      required: false
      type: TEXT
    - context: item
      label: Item für CPU-Last
      name: item_2
      required: false
      type: TEXT
    - label: CPU-Last F7-Icon (ohne F7:)
      name: icon_2
      required: false
      type: TEXT
    - label: CPU-Last TEXT
      name: text_2
      required: false
      type: TEXT
    - context: item
      label: Item für RAM-Belegung
      name: item_3
      required: false
      type: TEXT
    - label: RAM-Belegung F7-Icon (ohne F7:)
      name: icon_3
      required: false
      type: TEXT
    - label: RAM-Belegung TEXT
      name: text_3
      required: false
      type: TEXT
    - context: item
      label: Item für HD-Belegung
      name: item_4
      required: false
      type: TEXT
    - label: HD-Belegung F7-Icon (ohne F7:)
      name: icon_4
      required: false
      type: TEXT
    - label: HD-Belegung TEXT
      name: text_4
      required: false
      type: TEXT
  parameterGroups: []
timestamp: Feb 13, 2023, 6:26:28 AM
component: f7-card
config:
  style:
    border-radius: 20px
    box-shadow: var(--f7-card-expandable-box-shadow)
slots:
  default:
    - component: oh-link
      config:
        style:
          height: 140px
          border-radius: 20px
          display: flex
          flex-direction: column
          align-items: start
          justify-content: flex-start
      slots:
        default:
          - component: oh-link
            config:
              text: =props.title
              style:
                color: "=themeOptions.dark === 'dark' ? 'white' : 'grey'"
                margin: 0px 20px
                font-size: 18px
                font-weight: bold
          - component: oh-link
            config:
              text: = props.text_1 + ' ' +items[props.item_1].state
              iconF7: "=props.icon_1 ? props.icon_1 : ''"
              iconSize: 18
              color: "=themeOptions.dark === 'dark' ? 'white' : 'black'"
              style:
                margin: 10px 20px
                font-size: 15px
                font-weight: bold
          - component: oh-link
            config:
              text: "=props.text_2 ? props.text_2 + ' ' + items[props.item_2].state : items[props.item_2].state"
              iconF7: "=props.icon_2 ? props.icon_2 : ''"
              iconSize: 18
              color: "=themeOptions.dark === 'dark' ? 'white' : 'black'"
              style:
                margin: 0px 20px
                font-size: 15px
                font-weight: bold
          - component: oh-link
            config:
              text: "=props.text_3 ? props.text_3 + ' ' + items[props.item_3].state : items[props.item_3].state"
              iconF7: "=props.icon_3 ? props.icon_3 : ''"
              iconSize: 18
              color: "=themeOptions.dark === 'dark' ? 'white' : 'black'"
              style:
                margin: 0px 20px
                font-size: 15px
                font-weight: bold
          - component: oh-link
            config:
              text: "=props.text_4 ? props.text_4 + ' ' + items[props.item_4].state : items[props.item_4].state"
              iconF7: "=props.icon_4 ? props.icon_4 : ''"
              iconSize: 18
              color: "=themeOptions.dark === 'dark' ? 'white' : 'black'"
              style:
                margin: 0px 20px
                font-size: 15x
                font-weight: bold
          - component: oh-image
            config:
              style:
                height: 120px
                left: 170px
                opacity: 1
                position: absolute
                top: 10px
              url: "=themeOptions.dark === 'dark' ? '/static/icons/' + props.bild_night + '.png' : '/static/icons/' + props.bild_day + '.png'"

Alles anzeigen

Michael S. · 14. Februar 2023

Hallo ihr Widget-Experten,

mal eine Frage die eventuell etwas Off-Topic ist.

Bei den Widget mit Trendlines werden die Werte in der Ansicht aktualisiert, die Trendlines jedoch nur dann, wenn ich im Browser einen reload ausführe.

Gibt es da die Möglichkeit das zu automatisieren. Also der Wert ändert sich und die Trennlinie auch??

FMMephisto · 14. Februar 2023

Hallo Michael!

Das ist korrekt. In OH3 und der MainUI sind eigentlich statisch und reagieren nur auf Ereignisse. Dass sich die Werte ändern liegt daran, dass diese Werte durch z. B. Displaystate im Widget aufgerufen werden. Displaystate ist ein Ereignis/Befehl, der in der originären OH-Library vorhaden ist. Änder sich nun ein Wert, der z. b. über "=items.Temperatur.displayState im Widget aufgerufen wird, wird dieser Wert auch zeitnah aktualisiert.

Die Werte der Trendlinie werden nur alle 60 Minuten/oder anders eingestellt "weggeschrieben" und lösen kein Ereignis aus, was eine aktualisierten Aufruf des Widgets hervorruft.

Ich würde es so versuchen:

- Lege dir ein Item an mit dem Namen "Refresh_Timer".

- Kann z. b. ein Switch sein.

- dann baust du dir eine Rule, die z. b. alle 5 Minuten den "Refresh_Timer" mal an und wieder ausschaltet.

- im Widget baust du dieses Item z. b. so ein: key: =items.Refresh_Timer.state

So änderst du immer den Status des Schalters alle 5 oder sonstwie Minuten und greifst im Widget auf den Status des Items zu. Das löst somit auch den Refresh der Karte aus.

Keine Ahnung ob das so funktioniert... sooooo Profi bin ich noch nicht.

Könnte ich mir aber vorstellen.

Muss ich aber selbst mal ausprobieren.

Vielleicht ist da jemand schon weiter als ich, der Dir helfen kann.

Viele Grüße

Frank

Michael S. · 14. Februar 2023

Hallo Frank,

Vielen Dank für deine Antwort/Idee.

Ich were mich mal dran versuchen.

Michael S. · 16. Februar 2023

Hallo Frank,

man kann auch die entsprechenden Items (wo es eine Trendlinie gibt) hinter den Key: schreiben. Dann aktualisiert es jedes mal, wenn sich der Wert des Items ändert. Ich benötige dann keine weitere Rule.

FMMephisto · 16. Februar 2023

Hallo Michael!

Das ist ja noch besser.

Klingt so, als wäre damit Dein Problem gelöst.

Wenn dem so ist, freue ich mich.

Viele Grüße

Frank

Michael S. · 16. Februar 2023

Hallo Frank,

hat zwar was gedauert bis ich es dann hinbekommen habe, aber es geht....

FMMephisto · 16. Februar 2023

Stell gern mal den Code ein.

Damit könntest du anderen auch noch eine Hilfestellung geben!

Gruß

Frank

KDB · 16. Januar 2024

Hallo. gelten die Anleitungen auch für openHAB 4 ?

Danke

FMMephisto · 16. Januar 2024

Keine Ahnung! Darfst es gerne mal testen. Glaube, es geht bin viel kaputt!

Tupper · 17. Januar 2024

Zitat von KDB

Hallo. gelten die Anleitungen auch für openHAB 4 ?
Danke

Ich habe zwar noch kein Upgrade auf 4 durchgeführt, aber die Grundlagen sollten die gleichen sein.
Sollte aber etwas nicht funktionieren, einfach fragen.

CUSTOM WIDGET FÜR SHC UND MEHR

Jetzt mitmachen!

Teilen