SONOFF NSPanel mit Lovelace UI

[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 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:

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.

[Armilar]

@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

[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 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

[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)

[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.

[Armilar]

@tt-tom

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

[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:

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.

[ticaki]

@naturfreund

Da ist wohl noch ein alter Link drin.

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

[Naturfreund]

@ticaki said in SONOFF NSPanel mit Lovelace UI:

@naturfreund

Da ist wohl noch ein alter Link drin.

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

22:14:58.006 CMD: FlashNextion http://nspanel.de/nspanel-v5.0.2.tft
22:14:58.019 MQT: SmartHome/NSPanel_1/stat/RESULT = {"FlashNextion":"Done"}
22:14:58.064 FLH: host: nspanel.de, port: 80, get: /nspanel-v5.0.2.tft
22:14:58.555 FLH: Send (High Speed) flash start
22:14:59.007 FLH: Something has gone wrong flashing display firmware [bytes('85')]

Kann es an meiner Tasmota Version Tasmota 15.1.0.1 liegen?
Leider steht dort nicht, mit welchem Fehler der Flashvorgang abbricht.

Ganz unten in der FAQ 3.4 hab ich einen Hinweis gefunden:
TFT Firmware lässt sich mit Tasmota 15.1.0 nicht flashen

[Armilar]

@naturfreund

ja, habe eben die Wiki-Page noch geupdated...

Das Panel lässt sich nicht mit Tasmota 15.1.0 oder 15.1.0.1 flashen...

Kurz ein Downgrade mit Tasmota 15.0.1 machen, dann sollte es gehen...

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

[Naturfreund]

@armilar @ticaki

Danke euch beiden, TFT-Update läuft.

[Frederik Buss]

@armilar Du bist der Beste Dankeee!