Skip to content
  • Recent
  • Tags
  • 0 Unread 0
  • Categories
  • Unreplied
  • Popular
  • 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

  • Default (No Skin)
  • No Skin
Collapse
Logo
  1. ioBroker Community Home
  2. Deutsch
  3. Hardware
  4. SONOFF NSPanel mit Lovelace UI

NEWS

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

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

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

SONOFF NSPanel mit Lovelace UI

SONOFF NSPanel mit Lovelace UI

Scheduled Pinned Locked Moved Hardware
lovelace uinspanelsonoff
7.7k Posts 271 Posters 6.7m Views 253 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • MichaelFM MichaelF

    Hi, eine Kleinigkeit Funktioniert bei mir leider noch nicht, die Wettersymbole fehlen leider.

    Als Wetter habe ich jetzt Brightsky, aber hier steht noch mein alter Anbieter drinnen:

    b4f7e05b-ff7a-4671-b935-10422c4fccf1-image.png

    Wenn ich die drei Datenpunkte in die Brightsky ändere bekomme ich auch keine Symbole.

    Hat jemand vielleicht ein Tipp, wechsle ich wieder zum alten Anbieter geht alles.

    Grüsse

    ArmilarA Offline
    ArmilarA Offline
    Armilar
    Most Active Forum Testing
    wrote on last edited by
    #7697

    @michaelf

    den alias.0.Wetter im NSPanel-Script in z.B. alias.0.Brightsky_Wetter umbenennen oder den alias.0.Wetter unter Objekte löschen.

    Der legt sich dann neu an.

    Im Anschluss kannst du dann deine Sainlogic-Temperatur im neuen Alias wieder zuweisen.

    Installationsanleitung, Tipps, Alias-Definitionen, FAQ für das Sonoff NSPanel mit lovelace UI unter ioBroker
    https://github.com/joBr99/nspanel-lovelace-ui/wiki

    Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

    MichaelFM 1 Reply Last reply
    1
    • ArmilarA Armilar

      @michaelf

      den alias.0.Wetter im NSPanel-Script in z.B. alias.0.Brightsky_Wetter umbenennen oder den alias.0.Wetter unter Objekte löschen.

      Der legt sich dann neu an.

      Im Anschluss kannst du dann deine Sainlogic-Temperatur im neuen Alias wieder zuweisen.

      MichaelFM Offline
      MichaelFM Offline
      MichaelF
      wrote on last edited by
      #7698

      @armilar Danke 🙂

      1 Reply Last reply
      1
      • M Online
        M Online
        mading
        wrote on last edited by
        #7699

        Ich hätte eine Frage bzw. Anliegen. Wenn meine Heimautomatisierung eine Aktion durchführt, schreibe ich diese in ein JSON via logparser Adapter. Das ganze wird in einer Tabelle mit Timestamp und Aktion dargestellt, so dass ich nachvollziehen kann, was die Heimautomatisierung so treibt.

        Gerne würde ich, wenn solch eine Aktion ausgeführt wird, diese im NSPanel anzeigen lassen. Mein NSPanel steht bei mir am Arbeitsplatz mit dem Ständer und wird eigentlich nur für die Darstellung der wichtigen Werte des Hauses angezeigt.

        Wäre es möglich, sobald es einen neuen Eintrag in logparser.0.filters.Hausinfos.json gibt, ich diesen im NSPanel anzeigen lasse? Das Verarbeiten des JSON über Blockly und z.B. Zusammenbauen eines Strings ist kein Problem. Der Text soll z.B. 5 Sekunden automatisch angezeigt werden, dann sollte das NSPanel zurück in den Screensaver gehen.

        Könnte ich dafür eine bestimmte Card page nehmen und über 0_userdata.0.NSPanel.1.ActivePage.heading den Wechsel steuern? Welche Card wäre dafür am Besten?

        T 1 Reply Last reply
        0
        • M mading

          Ich hätte eine Frage bzw. Anliegen. Wenn meine Heimautomatisierung eine Aktion durchführt, schreibe ich diese in ein JSON via logparser Adapter. Das ganze wird in einer Tabelle mit Timestamp und Aktion dargestellt, so dass ich nachvollziehen kann, was die Heimautomatisierung so treibt.

          Gerne würde ich, wenn solch eine Aktion ausgeführt wird, diese im NSPanel anzeigen lassen. Mein NSPanel steht bei mir am Arbeitsplatz mit dem Ständer und wird eigentlich nur für die Darstellung der wichtigen Werte des Hauses angezeigt.

          Wäre es möglich, sobald es einen neuen Eintrag in logparser.0.filters.Hausinfos.json gibt, ich diesen im NSPanel anzeigen lasse? Das Verarbeiten des JSON über Blockly und z.B. Zusammenbauen eines Strings ist kein Problem. Der Text soll z.B. 5 Sekunden automatisch angezeigt werden, dann sollte das NSPanel zurück in den Screensaver gehen.

          Könnte ich dafür eine bestimmte Card page nehmen und über 0_userdata.0.NSPanel.1.ActivePage.heading den Wechsel steuern? Welche Card wäre dafür am Besten?

          T Offline
          T Offline
          ticaki
          wrote on last edited by
          #7700

          @mading

          Du könntest es unten im Screensaver einblenden oder als popupNotify ganzseitig.

          Weather-Warnings Espresense NSPanel-Lovelace-ui Tagesschau

          Spenden

          1 Reply Last reply
          2
          • ArmilarA Armilar

            DEV - Update v4.9.5

            heute gibt es drei wesentliche Neuerungen...

            c44fced2-7762-4909-a4df-ed86e5eb5b00-image.png

            Der Pirate-Weather Adapter:

            Viele von euch hatten bislang den sehr zuverlässigen Accuweather-Adapter als ebenso zuverlässigen Wetter-Forecast im NSPanel am Laufen. Dieser Developer Account (API) wird in absehbarer Zeit nicht mehr kostenneutral zur Verfügung gestellt (Accu-Weather Abbonnenten wurden bereits per Email informiert), und damit wird der Acuuweather-Adapter auch kurz- oder mittelfristig keine Wetterdaten mehr in den ioBroker liefern.

            Als sofortige Reaktion hatten wir bereits OpenWeatherMap als vorhandenen Adapter in das NSPanel implementiert. Allerdings wollten wir uns auch nicht von einem letzten verbleibenden Wetter-Adapter im ioBroker abhängig machen (Accuweather deprecated und DasWetter nur mit bestehendem Alt-Account noch nutzbar). Und somit traf die Wahl auf Pirate-Weather...

            Was ist Pirate-Weather?

            Pirate Weather ist eine kostenlose, quelloffene Wetterdaten-API, die als Ersatz für die Dark Sky API entwickelt wurde. Sie stellt Wettervorhersagedaten unter Verwendung derselben API-Syntax wie Dark Sky bereit, mit dem Ziel, Entwicklern eine alternative Quelle für Wetterinformationen zu bieten. Die API greift auf öffentlich zugängliche Daten von NOAA-Modellen wie GFS, HRRR und NBM zu und macht diese Daten über eine JSON-API zugänglich.

            Dark Sky, die beliebte Wetter-App und -API, wurde von Apple aufgekauft und Ende 2022 eingestellt. Die Funktionen und Daten wurden in Apples eigene Wetter-App integriert.
            Die ursprüngliche Dark Sky Wetter-API wurde am 31. März 2023 abgeschaltet. Nutzer wurden aufgefordert, auf Apples eigene Wetter-App oder andere Wetter-APIs umzusteigen.

            Welche Wetter Adapter werden aktuell im NSPanel unterstützt?

            • Accuweather (bis zur Abschaltung der bisherigen DEV API)
            • DasWetter (für alle die sich vor längerer Zeit einen Account zugelegt haben)
            • OpenWeatherMap
            • Pirate-Weather

            Wo finde ich den Pirate Weather Adaper?

            @ticaki hat den Pirate-Weather Adapter kurzfristig entwickelt und im Testbereich unter: https://forum.iobroker.net/topic/81885/test-adapter-pirate-weather zur Verfügung gestellt. Seht ihn euch gerne an. In den letzten Tagen hat er sich (unserer Meinung nach) zu einer perfekten Alternative für Accuweather entwickelt. Wir gehen auch davon aus, dass er kurzfristig das ioBroker Repository erreichen wird, da er im Prinzip bereits seit ein paar Tagen fertig ist und auch wirklich wunderbar funktioniert.

            Der Pirate-Weather Adapter hat übrigens auch ein paar Alleinstellungsmerkmale:

            • Forecast für die nächsten 60 Minuten
            • Forecast für die nächsten 48 Stunden
            • Forecast für die nächsten 7 Tage
            • Diverse Datenpunkte, die in anderen Wetteradaptern nicht zu finden sind

            Wie nutze ich den neuen Adapter im NSPanel?

            Vorausgesetzt ihr habt euch einen Free-Account bei Pirate-Weather angelegt (folgt einfach dem Adapter für die Installation der Instanz) und der Adapter liefert bei euch bereits die Wetterdaten müsst ihr nur folgendes tun:

            /***** 3. Weather adapter Config *****/
            
                // DE: Mögliche Wetteradapter 'accuweather.0.' oder 'daswetter.0.' oder 'openweathermap.0.' oder 'pirate-weather.0.'
                // EN: Possible weather adapters 'accuweather.0.' or 'daswetter.0.' or 'openweathermap.0. or 'pirate-weather.0.'
                const weatherAdapterInstance: string = 'pirate-weather.0.';
                
                // DE: Mögliche Werte: 'Min', 'Max' oder 'MinMax' im Screensaver
                // EN: Possible values: 'Min', 'Max' or 'MinMax' in the screensaver
                const weatherScreensaverTempMinMax: string = 'MinMax';
            
                // DE: Dieser Alias wird automatisch für den gewählten Wetter erstellt und kann entsprechend angepasst werden
                // EN: This alias is automatically created for the selected weather and can be adjusted accordingly
                const weatherEntityPath: string = 'alias.0.PWWetter';
            

            Sobald weatherAdapterInstance und weatherEntityPath umbenannt wurden, wird der neue Alias-Channel für Pirate-Weather automatisch erstellt und der Forecast läuft auf Pirate-Weather...

            !!!Achtung!!! Ihr braucht dafür das NsPanelTs.ts in der v4.9.5 (siehe unten)


            Die cardThermo2

            88aabf6a-f57a-4588-9c7d-0defddcf2104-Nextion_Editor_c0ug0wsghN.gif

            Die cardThermo2 ist die Alternative zur cardThermo mit erweiterter Funktionalität und "echten" Entitäten. Die cardThermo2 ist eine Mischung aus einer vollwertigen cardGrid mit "9 Entitäten" und hat im Zentrum die Funktionalität zur Steuerung eines Thermostaten, einer Klimaanlage oder Wärmepumpe. Die Temperatursteuerung besteht aus:

            • einem Circular Slider zur Einstellung der Zieltemperatur (Setpoint)
              • lässt sich über den kompletten Screen per Touch steuern
            • 2 Buttons (-/+)
              • ShortPress: Einzelsteps zur Steuerung der Zieltemperatur (Setpoint). Jeder Klick inkrementiert (+) oder dekrementiert (-) den Zieltemperatur-Wert (Setpoint) um den definierten Temperatur-Step (z.B. 0,5°C)
              • LongPress: Der Slider inkrementiert (+) oder dekrementiert (-) den Zieltemperatur-Wert (Setpoint) automatisch und erhöht dabei die Einstell-Geschwindigkeit

            Für die Beschreibung gibt bereits in der Wiki eine eigenständige Seite... Diese wird in den nächsten Tagen noch erweitert und mit einer "Step by Step"-Anleitung versehen.
            https://github.com/joBr99/nspanel-lovelace-ui/wiki/NSPanel-‐-cardThermo2-‐-Der-komplette-Leitfaden


            Der Berry Driver v10

            Ja - der Berry-Driver v9 wurde zuletzt vor etwa 2 Jahren bereitgestellt und jetzt ist es wieder soweit.

            • Aufgrund der anwachsenden Größe der TFT-Firmware (Nextion HMI), gab es auch ein paar Veränderungen, was die Installationqualität der TFT betrifft
            • Kommunikation mit 921.600 bps statt 115.200 bps
            • Ein paar Delays wurden verändert, um das TFT-Update bei 99% zu verbesssern

            Wie installiere ich den Berry v10?

            1. Tasmota Konsole öffnen
            2. folgende Zeile absenden
              Backlog UrlFetch https://raw.githubusercontent.com/ticaki/ioBroker.nspanel-lovelace-ui/refs/heads/main/tasmota/berry/10/autoexec.be; Restart 1
              
            3. warten bis das NSPanel rebootet hat und fertig 😉

            NSPanel Skript v4.9.5.1 und TFT 58/v4.9.5

            Wie immer den unteren Teil austauschen:

            https://github.com/joBr99/nspanel-lovelace-ui/blob/main/ioBroker/NsPanelTs.ts

            Die TFT steht für alle Verionen (eu/us-l und us-p) bereit:

            TFT EU STABLE Version:

            FlashNextionAdv0 http://nspanel.de/nspanel-v4.9.5.tft
            

            TFT US-L STABLE Version:

            FlashNextionAdv0 http://nspanel.de/nspanel-us-l-v4.9.5.tft
            

            TFT US-P STABLE Version:

            FlashNextionAdv0 http://nspanel.de/nspanel-us-p-v4.9.5.tft
            

            FlashNextion verwendet die letzten Kommunikationsgeschwindigkeiten des TFT. Wir nutzen daher ausschließlich FlashNextionAdv0, um die Kommunikation mit 921.600 baud sicherzustellen.


            So das war nun auch erstmal genug Text...

            Bei Fragen gerne Rückfragen und ansonsten:

            Viel Spaß mit den Neuerungen der v4.9.5

            @Armilar @ticaki @TT-Tom

            N Offline
            N Offline
            nono87
            wrote on last edited by
            #7701

            @armilar said in SONOFF NSPanel mit Lovelace UI:

            TFT US-P STABLE Version:
            Copy to Clipboard
            FlashNextionAdv0 http://nspanel.de/nspanel-us-p-v4.9.5.tft

            Hallo,

            ich kann es mir nicht erklären was ich falsch mache. Ich besitze 4 US-P Panels.
            Egal bei welchem ich das Update auf 4.9.5 mache es wird bei der NSPanel_Version angezeigt das ich ein EU Model habe. Wenn ich die 4.8.0 wieder installiere ist es auf US-P.
            Ist das schon mal vorgekommen?

            Grüße

            ArmilarA 1 Reply Last reply
            0
            • T ticaki

              Achtung! - BREAKING change in der Tasmota Firmware

              Tasmota 15.1.0 hat ungenannte Änderungen, die das flashen der TFT Firmware unmöglich machen

              nicht updaten auf die neuste Tasmota Version

              Wir sind dran. 🙂

              A Offline
              A Offline
              australien
              wrote on last edited by
              #7702

              @ticaki gibt es dazu was Neues?

              T 1 Reply Last reply
              0
              • A australien

                @ticaki gibt es dazu was Neues?

                T Offline
                T Offline
                ticaki
                wrote on last edited by
                #7703

                @australien
                Wenns um das 15.1 geht, nein.

                Weather-Warnings Espresense NSPanel-Lovelace-ui Tagesschau

                Spenden

                1 Reply Last reply
                0
                • N nono87

                  @armilar said in SONOFF NSPanel mit Lovelace UI:

                  TFT US-P STABLE Version:
                  Copy to Clipboard
                  FlashNextionAdv0 http://nspanel.de/nspanel-us-p-v4.9.5.tft

                  Hallo,

                  ich kann es mir nicht erklären was ich falsch mache. Ich besitze 4 US-P Panels.
                  Egal bei welchem ich das Update auf 4.9.5 mache es wird bei der NSPanel_Version angezeigt das ich ein EU Model habe. Wenn ich die 4.8.0 wieder installiere ist es auf US-P.
                  Ist das schon mal vorgekommen?

                  Grüße

                  ArmilarA Offline
                  ArmilarA Offline
                  Armilar
                  Most Active Forum Testing
                  wrote on last edited by Armilar
                  #7704

                  @nono87 Die 4.9.5 hatte einen Bug in der HMI und hat daher per Default "eu" gesendet...

                  Ist ab v5.0.2 behoben... Ihr könnt aber auch die HMI Version auf v5.0.2

                  FlashNextionAdv0 http://nspanel.de/nspanel-us-p-v5.0.2.tft
                  

                  anheben. Sollte mit dem Script v4.9.5 kompatibel sein 😊

                  Installationsanleitung, Tipps, Alias-Definitionen, FAQ für das Sonoff NSPanel mit lovelace UI unter ioBroker
                  https://github.com/joBr99/nspanel-lovelace-ui/wiki

                  Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

                  N 1 Reply Last reply
                  1
                  • ArmilarA Armilar

                    @nono87 Die 4.9.5 hatte einen Bug in der HMI und hat daher per Default "eu" gesendet...

                    Ist ab v5.0.2 behoben... Ihr könnt aber auch die HMI Version auf v5.0.2

                    FlashNextionAdv0 http://nspanel.de/nspanel-us-p-v5.0.2.tft
                    

                    anheben. Sollte mit dem Script v4.9.5 kompatibel sein 😊

                    N Offline
                    N Offline
                    nono87
                    wrote on last edited by
                    #7705

                    @armilar said in SONOFF NSPanel mit Lovelace UI:

                    @nono87 Die 4.9.5 hatte einen Bug in der HMI und hat daher per Default "eu" gesendet...

                    Ist ab v5.0.2 behoben... Ihr könnt aber auch die HMI Version auf v5.0.2

                    FlashNextionAdv0 http://nspanel.de/nspanel-us-p-v5.0.2.tft
                    

                    anheben. Sollte mit dem Script v4.9.5 kompatibel sein 😊

                    Super vielen Dank. Das hat geklappt 😊

                    Frederik BussF 1 Reply Last reply
                    1
                    • N nono87

                      @armilar said in SONOFF NSPanel mit Lovelace UI:

                      @nono87 Die 4.9.5 hatte einen Bug in der HMI und hat daher per Default "eu" gesendet...

                      Ist ab v5.0.2 behoben... Ihr könnt aber auch die HMI Version auf v5.0.2

                      FlashNextionAdv0 http://nspanel.de/nspanel-us-p-v5.0.2.tft
                      

                      anheben. Sollte mit dem Script v4.9.5 kompatibel sein 😊

                      Super vielen Dank. Das hat geklappt 😊

                      Frederik BussF Offline
                      Frederik BussF Offline
                      Frederik Buss
                      wrote on last edited by
                      #7706

                      Hallo zusammen, da mein NSPanel gerade umgezogen ist und ich die Optik gerne an meine Hauptvisu anpassen würde, meine Frage ob man individuelle Icons nutzen kann? Oder die bisherigen irgendwie austauschen?

                      T ArmilarA 2 Replies Last reply
                      0
                      • Frederik BussF Frederik Buss

                        Hallo zusammen, da mein NSPanel gerade umgezogen ist und ich die Optik gerne an meine Hauptvisu anpassen würde, meine Frage ob man individuelle Icons nutzen kann? Oder die bisherigen irgendwie austauschen?

                        T Offline
                        T Offline
                        ticaki
                        wrote on last edited by ticaki
                        #7707

                        @frederik-buss
                        Das ist @Armilar Baustelle - um ein Icon gegen was aktuelles auszutauschen mußt man alle 7000+ Icons neu anlegen. Die urspünglichen Daten sind verloren gegangen, deshalb geht nur alles oder garnix.

                        EDIT: hm ich kenne mich mit fonts nicht aus, aber wenn ich das richtig sehe sollte das machbar sein- im adapter hab ich mal vor ewigkeiten eine "dieses Zeichen" bedeutet "dieses Bild" angelegt... hmpf hab nur keinen Plan wie man ne fontdatei macht. Scheinbar fontdatei erzeugen -> in windows installiieren -> mit fontgenerator nach nextion umwandeln -> vorhandenen Font ersetzen.

                        EDIT2:

                        Hier ist die Datei: https://raw.githubusercontent.com/ticaki/ioBroker.nspanel-lovelace-ui/refs/heads/main/script/icons.json

                        Auszug:

                        {
                                "name": "abjad-hebrew",
                                "data": "M3.9 4L9 10.03C7.58 10.17 6.36 11.18 6 12.59L4 20H6.07L7.92 13.11C8.09 12.46 8.69 12 9.36 12H10.69L17.47 20H20.1L15 13.97C16.42 13.83 17.64 12.82 18 11.41L20 4H17.93L16.08 10.89C15.91 11.54 15.31 12 14.64 12H13.31L6.53 4Z",
                                "hex": "F328",
                                "version": "4.9.95",
                                "base64": "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+PHBhdGggZD0iTTMuOSA0TDkgMTAuMDNDNy41OCAxMC4xNyA2LjM2IDExLjE4IDYgMTIuNTlMNCAyMEg2LjA3TDcuOTIgMTMuMTFDOC4wOSAxMi40NiA4LjY5IDEyIDkuMzYgMTJIMTAuNjlMMTcuNDcgMjBIMjAuMUwxNSAxMy45N0MxNi40MiAxMy44MyAxNy42NCAxMi44MiAxOCAxMS40MUwyMCA0SDE3LjkzTDE2LjA4IDEwLjg5QzE1LjkxIDExLjU0IDE1LjMxIDEyIDE0LjY0IDEySDEzLjMxTDYuNTMgNFoiLz48L3N2Zz4="
                            },
                        

                        hex ist das gemappete Zeichen - base64 das bild.

                        Weather-Warnings Espresense NSPanel-Lovelace-ui Tagesschau

                        Spenden

                        Frederik BussF 1 Reply Last reply
                        0
                        • T ticaki

                          @frederik-buss
                          Das ist @Armilar Baustelle - um ein Icon gegen was aktuelles auszutauschen mußt man alle 7000+ Icons neu anlegen. Die urspünglichen Daten sind verloren gegangen, deshalb geht nur alles oder garnix.

                          EDIT: hm ich kenne mich mit fonts nicht aus, aber wenn ich das richtig sehe sollte das machbar sein- im adapter hab ich mal vor ewigkeiten eine "dieses Zeichen" bedeutet "dieses Bild" angelegt... hmpf hab nur keinen Plan wie man ne fontdatei macht. Scheinbar fontdatei erzeugen -> in windows installiieren -> mit fontgenerator nach nextion umwandeln -> vorhandenen Font ersetzen.

                          EDIT2:

                          Hier ist die Datei: https://raw.githubusercontent.com/ticaki/ioBroker.nspanel-lovelace-ui/refs/heads/main/script/icons.json

                          Auszug:

                          {
                                  "name": "abjad-hebrew",
                                  "data": "M3.9 4L9 10.03C7.58 10.17 6.36 11.18 6 12.59L4 20H6.07L7.92 13.11C8.09 12.46 8.69 12 9.36 12H10.69L17.47 20H20.1L15 13.97C16.42 13.83 17.64 12.82 18 11.41L20 4H17.93L16.08 10.89C15.91 11.54 15.31 12 14.64 12H13.31L6.53 4Z",
                                  "hex": "F328",
                                  "version": "4.9.95",
                                  "base64": "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+PHBhdGggZD0iTTMuOSA0TDkgMTAuMDNDNy41OCAxMC4xNyA2LjM2IDExLjE4IDYgMTIuNTlMNCAyMEg2LjA3TDcuOTIgMTMuMTFDOC4wOSAxMi40NiA4LjY5IDEyIDkuMzYgMTJIMTAuNjlMMTcuNDcgMjBIMjAuMUwxNSAxMy45N0MxNi40MiAxMy44MyAxNy42NCAxMi44MiAxOCAxMS40MUwyMCA0SDE3LjkzTDE2LjA4IDEwLjg5QzE1LjkxIDExLjU0IDE1LjMxIDEyIDE0LjY0IDEySDEzLjMxTDYuNTMgNFoiLz48L3N2Zz4="
                              },
                          

                          hex ist das gemappete Zeichen - base64 das bild.

                          Frederik BussF Offline
                          Frederik BussF Offline
                          Frederik Buss
                          wrote on last edited by
                          #7708

                          @ticaki Ich sehe dass die Icons als SVG direkt in der Json codiert sind. Daher frage ich mal anders herum. So sieht meine Haupt Visu aus:
                          Vis4.jpg
                          Hast Du vielleicht eine Idee wie man die Kacheln ähnlich hinbekommt? Die Icons an sich wären OK, mir würde es eher um Kachelfarben gehen, das ist glaube ich so nicht vorgesehen...? Daher war meine Idee das vielleicht mit Icons zu lösen, allerdings sind SVG's nicht unbedingt die beste Lösung.

                          ArmilarA 2 Replies Last reply
                          0
                          • Frederik BussF Frederik Buss

                            Hallo zusammen, da mein NSPanel gerade umgezogen ist und ich die Optik gerne an meine Hauptvisu anpassen würde, meine Frage ob man individuelle Icons nutzen kann? Oder die bisherigen irgendwie austauschen?

                            ArmilarA Offline
                            ArmilarA Offline
                            Armilar
                            Most Active Forum Testing
                            wrote on last edited by
                            #7709

                            @frederik-buss sagte in SONOFF NSPanel mit Lovelace UI:

                            Hallo zusammen, da mein NSPanel gerade umgezogen ist und ich die Optik gerne an meine Hauptvisu anpassen würde, meine Frage ob man individuelle Icons nutzen kann? Oder die bisherigen irgendwie austauschen?

                            @ticaki

                            EDIT: hm ich kenne mich mit fonts nicht aus, aber wenn ich das richtig sehe sollte das machbar sein- im adapter hab ich mal vor ewigkeiten eine "dieses Zeichen" bedeutet "dieses Bild" angelegt... hmpf hab nur keinen Plan wie man ne fontdatei macht. Scheinbar fontdatei erzeugen -> in windows installiieren -> mit fontgenerator nach nextion umwandeln -> vorhandenen Font ersetzen.

                            Klingt lustiger als es ist... 😊

                            Individuell geht schon mal gar nicht... Das würde bedeuten, dass

                            • man zunächst jedes optionale Bild in ein .ttf wandelt
                            • das .ttf als .zi in die HMI imporiert im .zi Format für jede Größe eine Fontdatei erstelllt (geht nicht in der gleichen .ttf)
                            • Dabei müssten alle Icon-Strings (Steuerelemente) einen dynamischen Font und eine dynamische Größe aus dem Backend zugewiesen bekommen...
                            • danach muss eine TFT.bin erstellt und geflasht werden...

                            Außerdem muss

                            • das neue Icon in die IconMapping aufgenommen werden
                            • Für User so visualisiert werden, dass der HEX, das Icon und der Icon-Name irgendwo visuell zu sehen ist und ausgewählt werden kann.

                            Wenn das irgendjemand liefern will, dann kann er das gerne machen 😉

                            Installationsanleitung, Tipps, Alias-Definitionen, FAQ für das Sonoff NSPanel mit lovelace UI unter ioBroker
                            https://github.com/joBr99/nspanel-lovelace-ui/wiki

                            Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

                            1 Reply Last reply
                            0
                            • Frederik BussF Frederik Buss

                              @ticaki Ich sehe dass die Icons als SVG direkt in der Json codiert sind. Daher frage ich mal anders herum. So sieht meine Haupt Visu aus:
                              Vis4.jpg
                              Hast Du vielleicht eine Idee wie man die Kacheln ähnlich hinbekommt? Die Icons an sich wären OK, mir würde es eher um Kachelfarben gehen, das ist glaube ich so nicht vorgesehen...? Daher war meine Idee das vielleicht mit Icons zu lösen, allerdings sind SVG's nicht unbedingt die beste Lösung.

                              ArmilarA Offline
                              ArmilarA Offline
                              Armilar
                              Most Active Forum Testing
                              wrote on last edited by Armilar
                              #7710

                              @frederik-buss sagte in SONOFF NSPanel mit Lovelace UI:

                              mir würde es eher um Kachelfarben gehen, das ist glaube ich so nicht vorgesehen...? Daher war meine Idee das vielleicht mit Icons zu lösen, allerdings sind SVG's nicht unbedingt die beste Lösung.

                              Das könnte nur funktionieren (nicht im Serial-Protokoll enthalten), indem man

                              • die Backgroundfarben ebenfalls definiert bei Icons aus dem Backend an das NSPanel übermittelt
                              • und in allen Cards die neuen Serial-Eigenschaften implementiert.

                              Es wird aus meiner Sicht nur mit SVG eingebettet in .zi-Fonts gehen, da "Bilder" einfach zu groß sind und der Speicher des TFT nur begrenzt ist. Du kannst auch Bilder nehmen (z.B. jpg oder png). Der Nextion Editor konvertiert sie erneut und die Bildgröße wächst...

                              Installationsanleitung, Tipps, Alias-Definitionen, FAQ für das Sonoff NSPanel mit lovelace UI unter ioBroker
                              https://github.com/joBr99/nspanel-lovelace-ui/wiki

                              Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

                              Frederik BussF 1 Reply Last reply
                              0
                              • ArmilarA Armilar

                                @frederik-buss sagte in SONOFF NSPanel mit Lovelace UI:

                                mir würde es eher um Kachelfarben gehen, das ist glaube ich so nicht vorgesehen...? Daher war meine Idee das vielleicht mit Icons zu lösen, allerdings sind SVG's nicht unbedingt die beste Lösung.

                                Das könnte nur funktionieren (nicht im Serial-Protokoll enthalten), indem man

                                • die Backgroundfarben ebenfalls definiert bei Icons aus dem Backend an das NSPanel übermittelt
                                • und in allen Cards die neuen Serial-Eigenschaften implementiert.

                                Es wird aus meiner Sicht nur mit SVG eingebettet in .zi-Fonts gehen, da "Bilder" einfach zu groß sind und der Speicher des TFT nur begrenzt ist. Du kannst auch Bilder nehmen (z.B. jpg oder png). Der Nextion Editor konvertiert sie erneut und die Bildgröße wächst...

                                Frederik BussF Offline
                                Frederik BussF Offline
                                Frederik Buss
                                wrote on last edited by
                                #7711

                                @armilar Es wäre ja eigentlich schon "ausreichend" wenn man eine Hintergrundfarbe für die Kacheln definieren könnte. Vielleicht mit einer zweiten Hintergrundfarbe für An/Aus, Wahr/Falsch etc. Ich weiss nicht wie die Kacheln definiert sind, aber wenn da ein paar Pixel zwischen den Kacheln ist und dort die allgemeine Hintergrundfarbe angezeigt wird, ist man ja eigentlich schon am Ziel. Das geht dann ein wenig in die Richtung, die auch z.B. das Shelly Wall Display hat und würde bstimmt nicht nur mir gefallen 🙂

                                ArmilarA 1 Reply Last reply
                                0
                                • Frederik BussF Frederik Buss

                                  @armilar Es wäre ja eigentlich schon "ausreichend" wenn man eine Hintergrundfarbe für die Kacheln definieren könnte. Vielleicht mit einer zweiten Hintergrundfarbe für An/Aus, Wahr/Falsch etc. Ich weiss nicht wie die Kacheln definiert sind, aber wenn da ein paar Pixel zwischen den Kacheln ist und dort die allgemeine Hintergrundfarbe angezeigt wird, ist man ja eigentlich schon am Ziel. Das geht dann ein wenig in die Richtung, die auch z.B. das Shelly Wall Display hat und würde bstimmt nicht nur mir gefallen 🙂

                                  ArmilarA Offline
                                  ArmilarA Offline
                                  Armilar
                                  Most Active Forum Testing
                                  wrote on last edited by Armilar
                                  #7712

                                  @frederik-buss

                                  ich baue es die Tage für erste Tests mal in eine cardGrid ein...

                                  Denke es geht in die Richtung:

                                  • onColor
                                  • offColor
                                  • onBGColor (funktional wie onColor, jedoch optional definierbar)
                                  • offBGColor (funktional wie offColor, jedoch optional definierbar)

                                  Installationsanleitung, Tipps, Alias-Definitionen, FAQ für das Sonoff NSPanel mit lovelace UI unter ioBroker
                                  https://github.com/joBr99/nspanel-lovelace-ui/wiki

                                  Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

                                  T Frederik BussF 2 Replies Last reply
                                  0
                                  • ArmilarA Armilar

                                    @frederik-buss

                                    ich baue es die Tage für erste Tests mal in eine cardGrid ein...

                                    Denke es geht in die Richtung:

                                    • onColor
                                    • offColor
                                    • onBGColor (funktional wie onColor, jedoch optional definierbar)
                                    • offBGColor (funktional wie offColor, jedoch optional definierbar)
                                    T Offline
                                    T Offline
                                    TT-Tom
                                    wrote on last edited by
                                    #7713

                                    @armilar

                                    Das Icon kann doch seine Farbe wechseln, wie wäre es denn da mit weiß und hellgrau? Das kommt doch der visu sehr ähnlich.

                                    Gruß Tom
                                    https://github.com/tt-tom17
                                    Wenn meine Hilfe erfolgreich war, benutze bitte das Voting unten rechts im Beitrag

                                    NSPanel Script Wiki
                                    https://github.com/joBr99/nspanel-lovelace-ui/wiki

                                    NSPanel Adapter Wiki
                                    https://github.com/ticaki/ioBroker.nspanel-lovelace-ui/wiki

                                    ArmilarA 1 Reply Last reply
                                    1
                                    • T TT-Tom

                                      @armilar

                                      Das Icon kann doch seine Farbe wechseln, wie wäre es denn da mit weiß und hellgrau? Das kommt doch der visu sehr ähnlich.

                                      ArmilarA Offline
                                      ArmilarA Offline
                                      Armilar
                                      Most Active Forum Testing
                                      wrote on last edited by
                                      #7714

                                      @tt-tom

                                      Ich mache das lieber flexibel... Bin keine Freund dieser Optik 😉

                                      Installationsanleitung, Tipps, Alias-Definitionen, FAQ für das Sonoff NSPanel mit lovelace UI unter ioBroker
                                      https://github.com/joBr99/nspanel-lovelace-ui/wiki

                                      Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

                                      1 Reply Last reply
                                      1
                                      • N Offline
                                        N Offline
                                        Naturfreund
                                        wrote on last edited by
                                        #7715

                                        Hi,

                                        ich hab mir auch ein NS Panel besorgt, nach der Anleitung bisher alles abgearbeitet (Anleitung ist super 🙂 ), hänge aber an folgendem Punkt:

                                        e4c7f822-16eb-4440-b2e1-18f9b6565280-image.png

                                        Der Link ist aus heutiger Sicht vermutlich veraltet:

                                        >>  TFT EU STABLE Version   : FlashNextion http://nspanel.pky.eu/lovelace-ui/github/nspanel-v4.4.0.tft  <<
                                        

                                        Aktuell ist die v5.0.2.1. Ersetze ich die Versionsnummer aus der Anleitung einfach mit der neuen Versionsnummer?

                                        >>  TFT EU STABLE Version   : FlashNextion http://nspanel.pky.eu/lovelace-ui/github/nspanel-v5.0.2.1.tft  <<
                                        

                                        Vielen Dank schon mal.

                                        T 1 Reply Last reply
                                        0
                                        • N Naturfreund

                                          Hi,

                                          ich hab mir auch ein NS Panel besorgt, nach der Anleitung bisher alles abgearbeitet (Anleitung ist super 🙂 ), hänge aber an folgendem Punkt:

                                          e4c7f822-16eb-4440-b2e1-18f9b6565280-image.png

                                          Der Link ist aus heutiger Sicht vermutlich veraltet:

                                          >>  TFT EU STABLE Version   : FlashNextion http://nspanel.pky.eu/lovelace-ui/github/nspanel-v4.4.0.tft  <<
                                          

                                          Aktuell ist die v5.0.2.1. Ersetze ich die Versionsnummer aus der Anleitung einfach mit der neuen Versionsnummer?

                                          >>  TFT EU STABLE Version   : FlashNextion http://nspanel.pky.eu/lovelace-ui/github/nspanel-v5.0.2.1.tft  <<
                                          

                                          Vielen Dank schon mal.

                                          T Offline
                                          T Offline
                                          ticaki
                                          wrote on last edited by ticaki
                                          #7716

                                          @naturfreund

                                          Da ist wohl noch ein alter Link drin.

                                          FlashNextion http://nspanel.de/nspanel-v5.0.2.tft

                                          Weather-Warnings Espresense NSPanel-Lovelace-ui Tagesschau

                                          Spenden

                                          N 1 Reply Last reply
                                          1
                                          Reply
                                          • Reply as topic
                                          Log in to reply
                                          • Oldest to Newest
                                          • Newest to Oldest
                                          • Most Votes


                                          Support us

                                          ioBroker
                                          Community Adapters
                                          Donate

                                          320

                                          Online

                                          32.4k

                                          Users

                                          81.3k

                                          Topics

                                          1.3m

                                          Posts
                                          Community
                                          Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
                                          ioBroker Community 2014-2025
                                          logo
                                          • Login

                                          • Don't have an account? Register

                                          • Login or register to search.
                                          • First post
                                            Last post
                                          0
                                          • Recent
                                          • Tags
                                          • Unread 0
                                          • Categories
                                          • Unreplied
                                          • Popular
                                          • GitHub
                                          • Docu
                                          • Hilfe