Skip to content
  • Home
  • Aktuell
  • Tags
  • 0 Ungelesen 0
  • Kategorien
  • Unreplied
  • Beliebt
  • GitHub
  • Docu
  • Hilfe
Skins
  • Light
  • Brite
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Standard: (Kein Skin)
  • Kein Skin
Einklappen
ioBroker Logo

Community Forum

donate donate
  1. ioBroker Community Home
  2. Deutsch
  3. Visualisierung
  4. Lovelace Einsteigerfragen

NEWS

  • Weihnachtsangebot 2025! 🎄
    BluefoxB
    Bluefox
    22
    1
    1.0k

  • UPDATE 31.10.: Amazon Alexa - ioBroker Skill läuft aus ?
    apollon77A
    apollon77
    48
    3
    9.1k

  • Monatsrückblick – September 2025
    BluefoxB
    Bluefox
    14
    1
    2.4k

Lovelace Einsteigerfragen

Geplant Angeheftet Gesperrt Verschoben Visualisierung
11 Beiträge 3 Kommentatoren 828 Aufrufe 3 Watching
  • Älteste zuerst
  • Neuste zuerst
  • Meiste Stimmen
Antworten
  • In einem neuen Thema antworten
Anmelden zum Antworten
Dieses Thema wurde gelöscht. Nur Nutzer mit entsprechenden Rechten können es sehen.
  • David G.D Offline
    David G.D Offline
    David G.
    schrieb am zuletzt editiert von David G.
    #2

    @srkonus

    Das hängt ganz daran, welche Karte du verwenden möchtest, es klappt fast mit jeder (auch wenn ich nicht bei allen sofort weiß wie).

    Zeug mal etwas, was dir gefällt, dann schauen wir, ob man es umsetzen kann.

    EDIT

    Hier mal ein Beispiel mit einer normalen Karte und mit Bild (hab einfach was genommen, was in meiner Visu schon an Bildern vor kommt).

    Bewegte Bilder müssten auch gehen als gif.

    Screen_Recordin-1714762459499.gif

    Beim Symbol bekomme ich gtad die zweite Farbe nicht geändert, müsste man mal am Desktop im Browser schauen was das ist. Da bin ich aber nicht so fit drinnen....

    EDIT 2
    Hier kann man sich auch schonmal Anregungen holen, auch wenn nicht alles bei uns klappt
    https://demo.home-assistant.io/

    Zeigt eure Lovelace-Visualisierung klick
    (Auch ideal um sich Anregungen zu holen)

    Meine Tabellen für eure Visualisierung klick

    S 1 Antwort Letzte Antwort
    0
    • David G.D David G.

      @srkonus

      Das hängt ganz daran, welche Karte du verwenden möchtest, es klappt fast mit jeder (auch wenn ich nicht bei allen sofort weiß wie).

      Zeug mal etwas, was dir gefällt, dann schauen wir, ob man es umsetzen kann.

      EDIT

      Hier mal ein Beispiel mit einer normalen Karte und mit Bild (hab einfach was genommen, was in meiner Visu schon an Bildern vor kommt).

      Bewegte Bilder müssten auch gehen als gif.

      Screen_Recordin-1714762459499.gif

      Beim Symbol bekomme ich gtad die zweite Farbe nicht geändert, müsste man mal am Desktop im Browser schauen was das ist. Da bin ich aber nicht so fit drinnen....

      EDIT 2
      Hier kann man sich auch schonmal Anregungen holen, auch wenn nicht alles bei uns klappt
      https://demo.home-assistant.io/

      S Offline
      S Offline
      srkonus
      schrieb am zuletzt editiert von
      #3

      @david-g Hey,

      vielen Dank für deine Antwort und entschuldige das ich erst jetzt dazu komme zu antworten. Alleine das die Lampe (oder ein anderes Symbol was man nimmt) je nach Zustand des Sensors die Farbe ändert, reicht mir schon.
      Wie hast du das gemacht? Bisher sind alle Versuche nichts.

      VG
      srkonus

      David G.D 1 Antwort Letzte Antwort
      0
      • S srkonus

        @david-g Hey,

        vielen Dank für deine Antwort und entschuldige das ich erst jetzt dazu komme zu antworten. Alleine das die Lampe (oder ein anderes Symbol was man nimmt) je nach Zustand des Sensors die Farbe ändert, reicht mir schon.
        Wie hast du das gemacht? Bisher sind alle Versuche nichts.

        VG
        srkonus

        David G.D Offline
        David G.D Offline
        David G.
        schrieb am zuletzt editiert von David G.
        #4

        @srkonus

        Die Lampe ist ein einfacher Button.
        Kann man so über die gui hinzufügen.

        Ich hab es ab Zeile 7 erweitert, um die Farben vom Theme zu umgehen:

        show_name: true
        show_icon: true
        type: button
        tap_action:
          action: toggle
        entity: light.Deckenlicht
        style: |
          :host {
            --paper-item-icon-color: red
          }
          :host {
            --paper-item-icon-active-color: green
          }
        
        

        Zeile 12 hat noch einen Fehler, das grün nimmt er nicht, muss ich am Montag mal vom Rechner aus schauen.

        Wenn dir die Farben vom Theme reichen, einfach nur eine "Schaltfläche" über die gui hinzufügen und Zb den DP vom Handy auswählen (den DP vorher über die DP Settings für lovelace aktivieren). Als Tipp-Aktion kannst du ja "keine" auswählen. Macht ja kein Sinn es zu schalten.

        Zeigt eure Lovelace-Visualisierung klick
        (Auch ideal um sich Anregungen zu holen)

        Meine Tabellen für eure Visualisierung klick

        S 1 Antwort Letzte Antwort
        0
        • David G.D David G.

          @srkonus

          Die Lampe ist ein einfacher Button.
          Kann man so über die gui hinzufügen.

          Ich hab es ab Zeile 7 erweitert, um die Farben vom Theme zu umgehen:

          show_name: true
          show_icon: true
          type: button
          tap_action:
            action: toggle
          entity: light.Deckenlicht
          style: |
            :host {
              --paper-item-icon-color: red
            }
            :host {
              --paper-item-icon-active-color: green
            }
          
          

          Zeile 12 hat noch einen Fehler, das grün nimmt er nicht, muss ich am Montag mal vom Rechner aus schauen.

          Wenn dir die Farben vom Theme reichen, einfach nur eine "Schaltfläche" über die gui hinzufügen und Zb den DP vom Handy auswählen (den DP vorher über die DP Settings für lovelace aktivieren). Als Tipp-Aktion kannst du ja "keine" auswählen. Macht ja kein Sinn es zu schalten.

          S Offline
          S Offline
          srkonus
          schrieb am zuletzt editiert von
          #5

          @david-g Danke, habe das hier:

          type: light
          entity: light.Handy_Bernd_here
          hold_action:
            action: none
          double_tap_action:
            action: none
          

          Dein Style wird allerdings vom Editor nicht angenommen, deswegen ist es hier jetzt nicht drin. Den Type "light" habe ich genommen, weil es auf den ersten Blick für mich ausreicht den Status meines Handys anzuzeigen.

          David G.D 1 Antwort Letzte Antwort
          0
          • S srkonus

            @david-g Danke, habe das hier:

            type: light
            entity: light.Handy_Bernd_here
            hold_action:
              action: none
            double_tap_action:
              action: none
            

            Dein Style wird allerdings vom Editor nicht angenommen, deswegen ist es hier jetzt nicht drin. Den Type "light" habe ich genommen, weil es auf den ersten Blick für mich ausreicht den Status meines Handys anzuzeigen.

            David G.D Offline
            David G.D Offline
            David G.
            schrieb am zuletzt editiert von David G.
            #6

            @srkonus

            Genau, der Editor kann nur "Standart".
            Wenn es speziell wird, muss man es händisch erweitern.

            Ich arbeite auch gerne mit der picture-elements. Da muss man sich aber was einarbeiten.
            https://community.home-assistant.io/t/styling-elements-in-picture-elements-card-a-small-tutorial/315252

            Zeigt eure Lovelace-Visualisierung klick
            (Auch ideal um sich Anregungen zu holen)

            Meine Tabellen für eure Visualisierung klick

            S 1 Antwort Letzte Antwort
            0
            • David G.D David G.

              @srkonus

              Genau, der Editor kann nur "Standart".
              Wenn es speziell wird, muss man es händisch erweitern.

              Ich arbeite auch gerne mit der picture-elements. Da muss man sich aber was einarbeiten.
              https://community.home-assistant.io/t/styling-elements-in-picture-elements-card-a-small-tutorial/315252

              S Offline
              S Offline
              srkonus
              schrieb am zuletzt editiert von
              #7

              @david-g Mmhh, klingt als ob es mir zu umständlich wird. Auch ist die Light Karte ja ein Schalter, auch wenn er keine Funktion hat.
              Eigentlich benötige ich nur eine reine Anzeige.

              David G.D 1 Antwort Letzte Antwort
              0
              • S srkonus

                @david-g Mmhh, klingt als ob es mir zu umständlich wird. Auch ist die Light Karte ja ein Schalter, auch wenn er keine Funktion hat.
                Eigentlich benötige ich nur eine reine Anzeige.

                David G.D Offline
                David G.D Offline
                David G.
                schrieb am zuletzt editiert von
                #8

                @srkonus

                Ist doch egal, wenn es ein Schalter ist. Hat ja keine Funktion.

                Ansonsten gibt's ja noch den gezeigten weg mit Bildern.
                Oder markdown, oder picture-elements. Selbst ent entities kann man es sauber umsetzen.

                Für deinen Fall führen viele Wege nach Rom.

                Zeigt eure Lovelace-Visualisierung klick
                (Auch ideal um sich Anregungen zu holen)

                Meine Tabellen für eure Visualisierung klick

                J 1 Antwort Letzte Antwort
                0
                • David G.D David G.

                  @srkonus

                  Ist doch egal, wenn es ein Schalter ist. Hat ja keine Funktion.

                  Ansonsten gibt's ja noch den gezeigten weg mit Bildern.
                  Oder markdown, oder picture-elements. Selbst ent entities kann man es sauber umsetzen.

                  Für deinen Fall führen viele Wege nach Rom.

                  J Offline
                  J Offline
                  JohannesF
                  schrieb am zuletzt editiert von
                  #9

                  Hallo,

                  die meisten Karten können das doch von ganz alleine. In der GUI gibt es dann oft eine Einstellung "Symbol je nach Zustand einfärben"

                  Habe das mit dem Zustand unten kurz ausprobiert und Entity, Glance und Button färben sich um.

                  Zustand:

                  {
                    "common": {
                      "name": "TestZustand",
                      "desc": "Manuell erzeugt",
                      "role": "state",
                      "type": "boolean",
                      "read": true,
                      "write": false,
                      "custom": {
                        "lovelace.0": {
                          "enabled": true,
                          "entity": "binary_sensor",
                          "name": "TestZustand"
                        }
                      }
                    },
                  

                  Entity:

                  type: entity
                  entity: binary_sensor.TestZustand
                  state_color: true
                  

                  Glance:

                  show_name: true
                  show_icon: true
                  show_state: true
                  type: glance
                  entities:
                    - entity: binary_sensor.TestZustand
                  state_color: true
                  

                  Button

                  show_name: true
                  show_icon: true
                  type: button
                  tap_action:
                    action: toggle
                  entity: binary_sensor.TestZustand
                  
                  David G.D 1 Antwort Letzte Antwort
                  0
                  • J JohannesF

                    Hallo,

                    die meisten Karten können das doch von ganz alleine. In der GUI gibt es dann oft eine Einstellung "Symbol je nach Zustand einfärben"

                    Habe das mit dem Zustand unten kurz ausprobiert und Entity, Glance und Button färben sich um.

                    Zustand:

                    {
                      "common": {
                        "name": "TestZustand",
                        "desc": "Manuell erzeugt",
                        "role": "state",
                        "type": "boolean",
                        "read": true,
                        "write": false,
                        "custom": {
                          "lovelace.0": {
                            "enabled": true,
                            "entity": "binary_sensor",
                            "name": "TestZustand"
                          }
                        }
                      },
                    

                    Entity:

                    type: entity
                    entity: binary_sensor.TestZustand
                    state_color: true
                    

                    Glance:

                    show_name: true
                    show_icon: true
                    show_state: true
                    type: glance
                    entities:
                      - entity: binary_sensor.TestZustand
                    state_color: true
                    

                    Button

                    show_name: true
                    show_icon: true
                    type: button
                    tap_action:
                      action: toggle
                    entity: binary_sensor.TestZustand
                    
                    David G.D Offline
                    David G.D Offline
                    David G.
                    schrieb am zuletzt editiert von
                    #10

                    @johannesf sagte in Lovelace Einsteigerfragen:

                    die meisten Karten können das doch von ganz alleine. In der GUI gibt es dann oft eine Einstellung "Symbol je nach Zustand einfärben"

                    Das ist mir neu. Ich sehe es bei keiner Karte. Und wenn nur die Farben des Themes.

                    Zeigt eure Lovelace-Visualisierung klick
                    (Auch ideal um sich Anregungen zu holen)

                    Meine Tabellen für eure Visualisierung klick

                    S 1 Antwort Letzte Antwort
                    0
                    • David G.D David G.

                      @johannesf sagte in Lovelace Einsteigerfragen:

                      die meisten Karten können das doch von ganz alleine. In der GUI gibt es dann oft eine Einstellung "Symbol je nach Zustand einfärben"

                      Das ist mir neu. Ich sehe es bei keiner Karte. Und wenn nur die Farben des Themes.

                      S Offline
                      S Offline
                      srkonus
                      schrieb am zuletzt editiert von
                      #11

                      @David-G @JohannesF
                      Danke euch für eure Infos und Antworten. Habe was zustande gebracht, sieht auch gut aus. Weitere Fragen werde ich im normalen Lovelace Bereich stellen.

                      1 Antwort Letzte Antwort
                      0
                      Antworten
                      • In einem neuen Thema antworten
                      Anmelden zum Antworten
                      • Älteste zuerst
                      • Neuste zuerst
                      • Meiste Stimmen


                      Support us

                      ioBroker
                      Community Adapters
                      Donate

                      755

                      Online

                      32.5k

                      Benutzer

                      81.6k

                      Themen

                      1.3m

                      Beiträge
                      Community
                      Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen | Einwilligungseinstellungen
                      ioBroker Community 2014-2025
                      logo
                      • Anmelden

                      • Du hast noch kein Konto? Registrieren

                      • Anmelden oder registrieren, um zu suchen
                      • Erster Beitrag
                        Letzter Beitrag
                      0
                      • Home
                      • Aktuell
                      • Tags
                      • Ungelesen 0
                      • Kategorien
                      • Unreplied
                      • Beliebt
                      • GitHub
                      • Docu
                      • Hilfe