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. Binding: Textfarbe nach Wert

NEWS

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

  • Monatsrückblick – September 2025
    BluefoxB
    Bluefox
    13
    1
    2.3k

  • Neues Video "KI im Smart Home" - ioBroker plus n8n
    BluefoxB
    Bluefox
    16
    1
    3.4k

Binding: Textfarbe nach Wert

Geplant Angeheftet Gesperrt Verschoben Visualisierung
17 Beiträge 8 Kommentatoren 2.5k Aufrufe 7 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.
  • G Offline
    G Offline
    gammler2003
    schrieb am zuletzt editiert von
    #6

    Hallo zusammen,

    auch ich nutze binding um die Textfarbe in einem Basic String Widget in meiner VIS zu ändern. In VIS Edit ändert sich die Farbe auch genau so wie sie soll - in der VIS Anzeige (egal ob Iphone-App oder wie Browser) ist die Textfarbe einfach nur schwarz. Refresh der VIS-Anzeige hilft nicht.

    Wenn ich die Textfarbe statisch ändere (also einfach einen Hex-Code eingebe und nicht über binding) wird die Farbe in der Anzeige korrekt angezeigt.

    Hat jemand eine Idee? Vielen Dank euch.

    SBorgS 1 Antwort Letzte Antwort
    0
    • G gammler2003

      Hallo zusammen,

      auch ich nutze binding um die Textfarbe in einem Basic String Widget in meiner VIS zu ändern. In VIS Edit ändert sich die Farbe auch genau so wie sie soll - in der VIS Anzeige (egal ob Iphone-App oder wie Browser) ist die Textfarbe einfach nur schwarz. Refresh der VIS-Anzeige hilft nicht.

      Wenn ich die Textfarbe statisch ändere (also einfach einen Hex-Code eingebe und nicht über binding) wird die Farbe in der Anzeige korrekt angezeigt.

      Hat jemand eine Idee? Vielen Dank euch.

      SBorgS Offline
      SBorgS Offline
      SBorg
      Forum Testing Most Active
      schrieb am zuletzt editiert von
      #7

      @gammler2003 sagte in Binding: Textfarbe nach Wert:

      In VIS Edit ändert sich die Farbe auch genau so wie sie soll

      Hi, da scheint schon der Fehler zu sein. Bindings werden nur zur Laufzeit ausgeführt (Runtime), nie im Editor.
      Da aber mein "Glaskugelmodus" ( ;) ) leider offline ist, wäre, um besser helfen zu können, mehr Infos nötig wie zB. mal dein Binding.
      Bindings funktionieren mit unter auch nicht im verwendeten Widget. Zum testen eignet sich das einfache "HTML-Widget". Dort kann man sich dann auch zuerst mal das Ergebnis des Bindings als Text ausgeben lassen.

      LG SBorg ( SBorg auf GitHub)
      Projekte: Lebensmittelwarnung.de | WLAN-Wetterstation | PimpMyStation

      G 1 Antwort Letzte Antwort
      0
      • SBorgS SBorg

        @gammler2003 sagte in Binding: Textfarbe nach Wert:

        In VIS Edit ändert sich die Farbe auch genau so wie sie soll

        Hi, da scheint schon der Fehler zu sein. Bindings werden nur zur Laufzeit ausgeführt (Runtime), nie im Editor.
        Da aber mein "Glaskugelmodus" ( ;) ) leider offline ist, wäre, um besser helfen zu können, mehr Infos nötig wie zB. mal dein Binding.
        Bindings funktionieren mit unter auch nicht im verwendeten Widget. Zum testen eignet sich das einfache "HTML-Widget". Dort kann man sich dann auch zuerst mal das Ergebnis des Bindings als Text ausgeben lassen.

        G Offline
        G Offline
        gammler2003
        schrieb am zuletzt editiert von
        #8

        @sborg Sorry, doof von mir ;-) Vielen Dank für deine Hilfe.

        Das Binding sieht wie folgt aus:

        {wert:alexa2.0.Smart-Home-Devices.xxx.thermostatMode; wert == cool ? "#1874CD" : "#ff0000"}
        

        Eingetragen unter CSS Font & Text/ color

        OliverIOO SBorgS 2 Antworten Letzte Antwort
        0
        • G gammler2003

          @sborg Sorry, doof von mir ;-) Vielen Dank für deine Hilfe.

          Das Binding sieht wie folgt aus:

          {wert:alexa2.0.Smart-Home-Devices.xxx.thermostatMode; wert == cool ? "#1874CD" : "#ff0000"}
          

          Eingetragen unter CSS Font & Text/ color

          OliverIOO Offline
          OliverIOO Offline
          OliverIO
          schrieb am zuletzt editiert von
          #9

          @gammler2003 sagte in Binding: Textfarbe nach Wert:

          {wert:alexa2.0.Smart-Home-Devices.xxx.thermostatMode; wert == cool ? "#1874CD" : "#ff0000"}

          im Beispiel von eben, denke ich, hat sich noch ein Fehler eingeschlichen, da um das cool sicherlich auch Anführungsstriche gehören.

          {wert:alexa2.0.Smart-Home-Devices.xxx.thermostatMode; wert == "cool" ? "#1874CD" : "#ff0000"}
          

          Damit die Funktionsweiße genau verstanden wird, hier nochmal eine Detailerklärung
          Bei Binding können mehrere Befehle hintereinander geschrieben werden. Die einzelnen Befehle werden mit einem ; getrennt.
          Zur Unterscheidung von anderen Angaben in den jeweiligen Felders müssen Binding-Anweisungen mit geschweiften Klammern eingeschlossen werden. Davor und danach können troztdem gültige Angaben gemacht werden.
          Anhand des Beispiels:

          wert:alexa2.0.Smart-Home-Devices.xxx.thermostatMode
          Der Inhalt des Datenpunkts wird in die Variable wert gepseichert und kann unter diesem namen weiter verwendet werden

          wert == "cool" ? "#1874CD" : "#ff0000"
          

          Diese Anweisung ist meist etwas schwer zu lesen, gibt es aber in mehrere Programmiersprachen und nennt sich ternärer Operator. Der Operator hat 3 Teile, die jeweils durch das ? und den : getrennt wird.

          Der erste Teil (vor dem Fragezeichen) ist eine Vergleichsoperation, bei der Wahr oder Falsch herauskommen muss (allerdings hat javascript da so seine besonderheiten. Bei Interesse kann man mal unter falsy und truthy nachschlagen).
          Hier wird der Inhalt von Wert mit dem Text "cool" verglichen. Wenn cool drin steht ist die Prüfung wahr, ansonsten falsch.

          Der nächste Teil nach dem Fragezeichen und vor dem Doppelpunkt ist die Anweisung, die ausgeführt wird, wenn die Prüfung im ersten Teil wahr ist.

          Der Teil nach dem Doppelpunkt ist die Anweisung, die ausgeführt wird, wenn die Prüfung falsch ergibt.

          Jetzt kann man das auch noch ineinander verschachteln, so das da sehr komplexe Anweisungen herauskommen, die kaum noch lesbar sind, aber durchaus funktionieren.

          Das Ergebnis dieses ternären Operators kann entweder in einer nachfolgenden Anweisung (nach einem weiteren Strichpunkt weiterverarbeitet werden. Gibt es keine weitere Anweisung, dann wird das Ergebnis einfach mit dem Inhalt der geschweiften Klammern ersetzt.

          bspw in einem html-Feld kann man folgendes machen

          der wert im datenpunk ist {val:wert:javascript.0.test1;val=="1"?"eins":"nicht eins"}
          

          wenn der datenpunkt 1 enthält, dann wird
          der wert im datenpunk ist eins
          ausgegeben, ansonsten
          der wert im datenpunk ist nicht eins
          ausgegeben.

          weitere infos zu binding hier
          https://github.com/ioBroker/ioBroker.vis

          Meine Adapter und Widgets
          TVProgram, SqueezeboxRPC, OpenLiga, RSSFeed, MyTime,, pi-hole2, vis-json-template, skiinfo, vis-mapwidgets, vis-2-widgets-rssfeed
          Links im Profil

          1 Antwort Letzte Antwort
          2
          • G gammler2003

            @sborg Sorry, doof von mir ;-) Vielen Dank für deine Hilfe.

            Das Binding sieht wie folgt aus:

            {wert:alexa2.0.Smart-Home-Devices.xxx.thermostatMode; wert == cool ? "#1874CD" : "#ff0000"}
            

            Eingetragen unter CSS Font & Text/ color

            SBorgS Offline
            SBorgS Offline
            SBorg
            Forum Testing Most Active
            schrieb am zuletzt editiert von
            #10

            @gammler2003 gibt eigentlich nichts zu ergänzen, @OliverIO hat es schon ausführlich erklärt, bis auf das C&P-Monster (oder auch einfach C&P-Fehler) beim Beispiel:

            der wert im datenpunk ist {val:javascript.0.test1;val=="1"?"eins":"nicht eins"} 
            

            funktioniert besser :grinning:

            Bei deinem Binding passiert folgendes:

            {wert:alexa2.0.Smart-Home-Devices.xxx.thermostatMode; wert == cool ? "#1874CD" : "#ff0000"} 
            

            Es wird die Variable wert (=der Inhalt des vorher definierten Datenpunktes) mit der Variablen cool verglichen ob sie gleich ist. cool hast du aber nicht als Variable definiert, sondern willst wohl eher vergleichen ob der Inhalt deines Datenpunktes "cool" ist.
            Deswegen

            {wert:alexa2.0.Smart-Home-Devices.xxx.thermostatMode; wert == "cool" ? "#1874CD" : "#ff0000"} 
            

            Wenn du dies nun in ein HTM-Widget als "Inhalt" einträgst, wirst du sehen, dass die Ausgabe sich je nach Inhalt deines abgefragten Datenpunktes ändert. Beim falschen Binding dagegen wird sie immer "#ff0000" lauten.

            Die Farbe des Textes im Editor wird sich auch nicht in Abhängigkeit des Datenpunktes ändern. Das ist mehr Zufall, denn wenn du wie hier in den Eigenschaften (text-color) ein Binding einträgst, interpretiert der Editor einfach den ersten Farbwert (bei dir dann #1874CD) den er im Binding findet ohne das Binding wirklich auszuführen ;)

            LG SBorg ( SBorg auf GitHub)
            Projekte: Lebensmittelwarnung.de | WLAN-Wetterstation | PimpMyStation

            OliverIOO 1 Antwort Letzte Antwort
            0
            • SBorgS SBorg

              @gammler2003 gibt eigentlich nichts zu ergänzen, @OliverIO hat es schon ausführlich erklärt, bis auf das C&P-Monster (oder auch einfach C&P-Fehler) beim Beispiel:

              der wert im datenpunk ist {val:javascript.0.test1;val=="1"?"eins":"nicht eins"} 
              

              funktioniert besser :grinning:

              Bei deinem Binding passiert folgendes:

              {wert:alexa2.0.Smart-Home-Devices.xxx.thermostatMode; wert == cool ? "#1874CD" : "#ff0000"} 
              

              Es wird die Variable wert (=der Inhalt des vorher definierten Datenpunktes) mit der Variablen cool verglichen ob sie gleich ist. cool hast du aber nicht als Variable definiert, sondern willst wohl eher vergleichen ob der Inhalt deines Datenpunktes "cool" ist.
              Deswegen

              {wert:alexa2.0.Smart-Home-Devices.xxx.thermostatMode; wert == "cool" ? "#1874CD" : "#ff0000"} 
              

              Wenn du dies nun in ein HTM-Widget als "Inhalt" einträgst, wirst du sehen, dass die Ausgabe sich je nach Inhalt deines abgefragten Datenpunktes ändert. Beim falschen Binding dagegen wird sie immer "#ff0000" lauten.

              Die Farbe des Textes im Editor wird sich auch nicht in Abhängigkeit des Datenpunktes ändern. Das ist mehr Zufall, denn wenn du wie hier in den Eigenschaften (text-color) ein Binding einträgst, interpretiert der Editor einfach den ersten Farbwert (bei dir dann #1874CD) den er im Binding findet ohne das Binding wirklich auszuführen ;)

              OliverIOO Offline
              OliverIOO Offline
              OliverIO
              schrieb am zuletzt editiert von
              #11

              @sborg sagte in Binding: Textfarbe nach Wert:

              funktioniert besser

              stimmt

              Meine Adapter und Widgets
              TVProgram, SqueezeboxRPC, OpenLiga, RSSFeed, MyTime,, pi-hole2, vis-json-template, skiinfo, vis-mapwidgets, vis-2-widgets-rssfeed
              Links im Profil

              G 1 Antwort Letzte Antwort
              0
              • OliverIOO OliverIO

                @sborg sagte in Binding: Textfarbe nach Wert:

                funktioniert besser

                stimmt

                G Offline
                G Offline
                gammler2003
                schrieb am zuletzt editiert von
                #12

                @oliverio @SBorg
                Ich verneige mich und sage ganz herzlichen Dank für eure Hilfe. Es funktioniert!

                1 Antwort Letzte Antwort
                0
                • G Offline
                  G Offline
                  G.Hawk
                  schrieb am zuletzt editiert von
                  #13

                  Hallo

                  Ich habe eine kurze Frage dazu:

                  Wenn ich mehrere Bedingunggen einfüge, also wenn dann, wenn dann, sonst.
                  Wie muss ich das schreiben?

                  Das funktioniert nicht:

                  {wert:yamaha.0.Realtime.MAIN.PWR; wert == "Standby" ? "#B5B5B5" : "#FF0000"; wert == "On" ? "#00FF00" : "#0000CD" }
                  

                  Also Z.B: Wenn "Standby" dann grau, Wenn "on" dann grün usw........ sonst rot.

                  Er soll die Textfarbe ändern bei "Standby" und "on".
                  Das möchte ich später noch erweitern, deshalb möchte ich gern verstehen, wie das funktioniert.

                  Nächste Frage wäre ob ich den Datenpunkt immer reinschreiben muss oder ob er sich den von der ObjektID automatisch holt, das habe ich oben nicht ganz vertanden.

                  Gruß

                  bahnuhrB 1 Antwort Letzte Antwort
                  0
                  • G G.Hawk

                    Hallo

                    Ich habe eine kurze Frage dazu:

                    Wenn ich mehrere Bedingunggen einfüge, also wenn dann, wenn dann, sonst.
                    Wie muss ich das schreiben?

                    Das funktioniert nicht:

                    {wert:yamaha.0.Realtime.MAIN.PWR; wert == "Standby" ? "#B5B5B5" : "#FF0000"; wert == "On" ? "#00FF00" : "#0000CD" }
                    

                    Also Z.B: Wenn "Standby" dann grau, Wenn "on" dann grün usw........ sonst rot.

                    Er soll die Textfarbe ändern bei "Standby" und "on".
                    Das möchte ich später noch erweitern, deshalb möchte ich gern verstehen, wie das funktioniert.

                    Nächste Frage wäre ob ich den Datenpunkt immer reinschreiben muss oder ob er sich den von der ObjektID automatisch holt, das habe ich oben nicht ganz vertanden.

                    Gruß

                    bahnuhrB Online
                    bahnuhrB Online
                    bahnuhr
                    Forum Testing Most Active
                    schrieb am zuletzt editiert von
                    #14

                    @g-hawk sagte in Binding: Textfarbe nach Wert:

                    deshalb möchte ich gern verstehen, wie das funktioniert.

                    Es funktioniert so wie jede andere if then Abfrage.

                    {wert:yamaha.0.Realtime.MAIN.PWR; wert == "Standby" ? "grau" : wert == "on" ? "grün" : "rot" }
                    

                    Die Farben noch ersetzen durch deine #..

                    Du schreibt in der Bedingung on groß; aber im Text klein.
                    Was ist nun richtig ?

                    @g-hawk sagte in Binding: Textfarbe nach Wert:

                    ob ich den Datenpunkt immer reinschreiben muss

                    ja, du musst ja der Variablen "wert" etwas zuweisen (kann ja auch was anderes sein).


                    Wenn ich helfen konnte, dann Daumen hoch (Pfeil nach oben)!
                    Danke.
                    gute Forenbeiträge: https://forum.iobroker.net/topic/51555/hinweise-f%C3%BCr-gute-forenbeitr%C3%A4ge
                    ScreenToGif :https://www.screentogif.com/downloads.html

                    G 1 Antwort Letzte Antwort
                    1
                    • bahnuhrB bahnuhr

                      @g-hawk sagte in Binding: Textfarbe nach Wert:

                      deshalb möchte ich gern verstehen, wie das funktioniert.

                      Es funktioniert so wie jede andere if then Abfrage.

                      {wert:yamaha.0.Realtime.MAIN.PWR; wert == "Standby" ? "grau" : wert == "on" ? "grün" : "rot" }
                      

                      Die Farben noch ersetzen durch deine #..

                      Du schreibt in der Bedingung on groß; aber im Text klein.
                      Was ist nun richtig ?

                      @g-hawk sagte in Binding: Textfarbe nach Wert:

                      ob ich den Datenpunkt immer reinschreiben muss

                      ja, du musst ja der Variablen "wert" etwas zuweisen (kann ja auch was anderes sein).

                      G Offline
                      G Offline
                      G.Hawk
                      schrieb am zuletzt editiert von
                      #15

                      @bahnuhr

                      Super danke es klappt einwandrei.

                      1 Antwort Letzte Antwort
                      0
                      • G Offline
                        G Offline
                        G.Hawk
                        schrieb am zuletzt editiert von
                        #16

                        Eine Frage habe ich noch.
                        Kann soetwas irgendwie klappen wenn ich das bei Box Shaddow unter CSS Schatten und Abstand eintrage?

                        {wert:0_userdata.0.VIS.Werte_Test; wert == "true" ? "box-shadow:inset 0px 0px 10px #FFFFFF" : "box-shadow:inset 0px 0px 10px #39db00" }
                        
                        G 1 Antwort Letzte Antwort
                        0
                        • G G.Hawk

                          Eine Frage habe ich noch.
                          Kann soetwas irgendwie klappen wenn ich das bei Box Shaddow unter CSS Schatten und Abstand eintrage?

                          {wert:0_userdata.0.VIS.Werte_Test; wert == "true" ? "box-shadow:inset 0px 0px 10px #FFFFFF" : "box-shadow:inset 0px 0px 10px #39db00" }
                          
                          G Offline
                          G Offline
                          G.Hawk
                          schrieb am zuletzt editiert von
                          #17

                          @g-hawk

                          Frage selbst beantwortet.

                          {wert:0_userdata.0.VIS.Werte_Test; wert == "true" ? "inset 0px 0px 10px #FFFFFF" : "inset 0px 0px 10px #39db00" }
                          

                          Klappt!

                          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

                          808

                          Online

                          32.4k

                          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