Anzeige bauen im Dashboard mit z.B. abnehmenden LED Anzeigen von 10 oder 20 Stück möglich??

HA-DAU

Active member
Hallo zusammen,
ich bin aktuell wieder mal bei einem Versuch zu basteln mit einer abnehmenden LED Anzeige analog zum Beispiel hier...
1737810079129.png
Ist so was eigentlich möglich?
0% bis 100% = alle 10% = 10 Stück
oder alle 5% = 20 Stück

Klar mit Gaugen haben ich so was schon gemacht..
Schubst mich mal in die richtige Richtung....
 
Hi,

dürfte doch eigentlich quasi nix anderes sein. So einer Karte gibst Du die Anweisungen ja auch entsprechend mit, kommt dann halt nur noch darauf an, wie man der LED-Anzeige mitteilt, wann sie wie was machen soll. Insofern wäre erstmal der Steuerungsteil der LED-Anzeige relevant (und wie Du da via HomeAssistant dran kommst), der Rest dürfte eigentlich nicht sonderlich schwierig sein (sag ich jetzt mal so als HA-Laie 😅) .
 
Hallo @blurrrr,

ich habe mich vermutlich falsch ausgedrückt oder beschrieben.
Ich habe nennen wir es Zisterne als Sensor.
Da möchte ich gerne eine Anzeige haben hochkant oder quer, das ist aktuell egal. Da leuchten je nach Füllstand entweder alle 10 Lämpchen (grün) bei 100%, oder nur zwei Lämpchen bei 20% (rot) Füllstand.
Notfalls auch noch bei 30% gelb....

Hier die Gauge dazu...
1737811139876.png
 
Achso, Du meinst, Du willst im HomeAssistant einfach nur eine digitale Anzeige haben, welche so ausssieht wie auf dem Bild in Deinem ersten Post, ok... sorry, da hab ich Dich wohl ordentlich falsch verstanden 😅

Puh, da haste Dir ja etwas einfallen lassen... habe grade mal ein wenig geschaut, aber so ziemlich nix in diese Richtung gefunden (vielleicht hab ich auch einfach nur nicht das richtige gesucht 😅). Alternativ könnte man halt mal schauen, ob man sich sowas nicht irgendwie selbst gebastelt bekommt. Wird sicherlich nicht sonderlich schön sein, aber wenn man einfach 10 Entitäten anlegt, welche quasi nur aus einem Block bestehen, könnte man die ggf. noch einfärben oder so... Als Blockspiel mal jenen hier: "█" (ALT+219, ASCII-Code).

Eingefärbt: ███████████
Mit Abständen: █ █ █ █ █ █ █ █ █ █ █

Optisch sicherlich nicht das schönste, aber... naja... Hier sind es jetzt einfach nur ein paar Zeichen hintereinander, das müsste man in HomeAssistant dann ggf. so drehen, dass - wie auch immer (da bin ich echt raus) - jeder Block für sich einzeln ansprechbar wäre und wenn der Beispielwert "7" wäre, dass die Blöcke 1-7 entsprechend eingefärbt werden (in diesem Beispiel eben grün) und die restlichen Blöcke bei der Grundfarbe (z.B. rot) bleiben.

Aber warte mal lieber noch etwas ab... Vielleicht hat da noch jemand "die" Idee. Meine Idee scheint mir doch "etwas" weit hergeholt, vielleicht gibt es da ja doch schon etwas fertiges (was definitiv zu bevorzugen wäre 😅).
 
Hallo @blurrrr,

Puh, da haste Dir ja etwas einfallen lassen...
ja, einfach kann jeder......
Aber ja genau in etwa die Richtung habe ich mir das vorgestellt. Vielleicht noch die Prozente darin eingebettet.
Ist aber nicht lebenswichtig, war nur so ein Fun Gedanken....
Man hat ja sonst nichts zu tun.... ;)

Aktuell habe ich das gebastelt, aber der Abstand bleibt immer gleich.
Nur die Farben ändern sich.
1737814815738.png
Die Idee kam von hier:
https://github.com/custom-cards/bar-card
 
Zuletzt bearbeitet:
Ich habe sowas für den Batteriestatus meiner Batterie erstellt. Theoretisch für Deinen Fall anpassbar.

Screenshot_1.png

Code:
      - type: custom:bar-card
        style: |-
          bar-card-value {
            border: none;
          }
        entity: sensor.fire_tablet_batterie
        severity:
          - from: "0"
            color: gray
            to: "0"
          - from: "1"
            to: "49"
            color: rgb(255, 165, 0)
          - from: "50"
            to: "100"
            color: green
        name: " "
        height: 42px
        min: "0"
        max: "100"
        entity_row: true
        color: green
        positions:
          icon: "off"
          indicator: "off"
          value: "off"
        card_mod:
          style: |
            ha-card {
              padding: 8px 4px 4px 4px;
              margin-left: 12px;
              --bar-card-border-radius: 12px;
            }
            bar-card-backgroundbar {
              opacity: 0.2;
              filter: brightness(1);
            }
Hier musst du halt entsprechend deiner gewünschten Stufen die Farben zu weisen. Entsprechend x von 100%.
 
allo @saffi,

das sieht schon gut aus.
Aber bist Du sicher, dass die Einrückungen passen?
Bei mir wird nichts angezeigt, obwohl ich den Sensor getauscht habe.
Macht es einen Unterschied, ob es als Code (durch dich eingefügt)
1737817391097.png
oder als yaml eingefügt wird?

Also ich bekomme das nicht umgeschrieben, egal welche Einrückungen ich benutze....
Einer eine Idee, wo das Problem sein kann?
Vermutlich der hinter der Tastatur.... ;)

Mein yaml Code für 7 Farben sieht aktuell so aus und funktioniert...
YAML:
title: Severity 7 Farben
type: custom:bar-card
severity:
  - color: Red
    from: 0
    to: 25
  - color: orange
    from: 26
    to: 50
  - color: lime
    from: 51
    to: 60
  - color: purple
    from: 61
    to: 70
  - color: pink
    from: 71
    to: 80
  - color: green
    from: 81
    to: 95
  - color: blue
    from: 96
    to: 105
entities:
  - entity: sensor.zisterne

1737819048923.png
 
Zuletzt bearbeitet:
ok, sorry. Muss anmerken, dass ich es aus einem Konstrukt rauskopiert hatte. Dann passen natürlich die Einrückungen bei Dir gänzlich nicht.^^ Ich schau mal kurz nach.
 
Versuche nochmal auf einer neuen Karte das einzufügen. Habe leider kein Anwendungsgebiet, wo ich verschiedene Werte mit den Farben testen kann. Aber beim erstellen mit meiner Batterie, wurd die Farbe jeweils geändert.

Code:
type: custom:stack-in-card
cards:
  - type: custom:layout-card
    layout_type: custom:grid-layout
    layout:
      grid-template-columns: 45% 55%
      margin: "-4px -4px -8px -4px;"
    cards:
      - type: custom:mushroom-template-card
        card_mod:
          style: |
            ha-card {
              border: none;
            }
        entity: sensor.fire_tablet_batterie
        primary: Batterie Tablet
        secondary: "{{states('sensor.fire_tablet_batterie') }}%"
        icon: mdi:home-battery-outline
        icon_color: green
        icon_type: icon
        badge_icon: "{% if is_state('binary_sensor.fire_tablet_eingesteckt','on') %}\n\_\_mdi:arrow-up-bold\n{% endif %}"
        badge_color: "{% if is_state('binary_sensor.fire_tablet_eingesteckt','on') %}\n\_\_green\n{% endif %}"
        tap_action:
          action: navigate
          navigation_path: energia
      - type: custom:bar-card
        style: |-
          bar-card-value {
            border: none;
          }
        entity: sensor.fire_tablet_batterie
        severity:
          - from: "0"
            color: red
            to: "25"
          - from: "26"
            to: "50"
            color: orange
          - from: "51"
            to: "60"
            color: lime
          - from: "61"
            to: "70"
            color: purple
          - from: "71"
            to: "80"
            color: pink
          - from: "81"
            to: "95"
            color: green
          - from: "96"
            to: "105"
            color: blue
        name: " "
        height: 42px
        min: "0"
        max: "100"
        entity_row: true
        color: green
        positions:
          icon: "off"
          indicator: "off"
          value: "off"
        card_mod:
          style: |
            ha-card {
              padding: 4px;
              margin-left: 12px;
              --bar-card-border-radius: 12px;
            }
            bar-card-backgroundbar {
              opacity: 0.2;
              filter: brightness(1);
            }
 
Hallo @saffi,

danke für das testen.
Habe aktuell den Homeassistant PC zum testen heruntergefahren.
Kann das erst Morgen wieder testen..
Andere Termine sind in den Fokus gerückt.... ;)
 
alles gut. zum vereinfachen habe ich mal den Code komplett beschnitten. Dann sollte es auch funktionieren. Musst dann nur die jeweiligen Formartierung nach und nach wieder inkludieren.

Code:
type: custom:bar-card
entity: sensor.fire_tablet_batterie
severity:
  - from: "0"
    color: red
    to: "25"
  - from: "26"
    to: "50"
    color: orange
  - from: "51"
    to: "60"
    color: lime
  - from: "61"
    to: "70"
    color: purple
  - from: "71"
    to: "80"
    color: pink
  - from: "81"
    to: "95"
    color: green
  - from: "96"
    to: "105"
    color: blue
name: "Zisterne"
min: "0"
max: "105"

Bis später.
 
Hallo @saffi,

der einzige Code ist aktuell nur der aus Beitrag #14 von Dir welcher bei mir funktioniert.
Die uptime-card habe ich auch installiert und ausprobiert.
War aber aktuell nicht der Brüller, was mir zusagt.

Aktuell wird das Projekt auf die Seite gelegt und das was ich ausprobiert habe beobachtet.

Außer es kommen noch aktuelle bessere Ideen daher zum ausprobieren.
 
Die Uptimecard zeigt die Verfügbarkeit / den Zustand eines (binären) Sensors über die Zeit an, nicht sowas wie einen Batteriezustand.

Generell ist es sinnvoll, statt "ich brauch ne Anzeige xy" konkret zu sagen, was man beabsichtigt.
 

Zurzeit aktive Besucher

Keine Mitglieder online.

Letzte Anleitungen

Statistik des Forums

Themen
6.130
Beiträge
59.566
Mitglieder
6.190
Neuestes Mitglied
Idoli_99
Zurück
Oben