FHEM Forum

FHEM => Frontends => TabletUI => Thema gestartet von: Leeloo_Dallas am 14 März 2017, 12:21:54

Titel: (gelöst)fhemSVG.css:Icon für rc_9!=Anzeige/Aussage in FTUI=> Font erstellt :)
Beitrag von: Leeloo_Dallas am 14 März 2017, 12:21:54
Moin zusammen,
ich bin gerade dabei ein Code-Schloß in FTUI aufzunehmen und benötige dazu die "rc_*-Icons".
Dabei ist mir aufgefallen, dass die Zuordnung des Icons "rc_9" nicht als solches Icon (also einer 9) in FTUI angezeigt wird.
Der Screenshot im Anhang sollte verdeutlichen was ich meine.
Ich habe aber leider noch nicht durchgeblickt, was ich in der "fhemSVG.css" geändert/korrigiert werden muss, damit auch eine "9" angezeigt wird.
Wäre schön, wenn es jemand fixt bzw. mir den Hinweis für eine lokale Korrektur gibt.
Danke !!!

Gruß
Leeloo
Titel: Antw:fhemSVG.css: Icon für rc_9 != Anzeige/Aussage in FTUI
Beitrag von: Standarduser am 14 März 2017, 13:45:26
In der fhemSVG.css muss dahingehend nichts angepasst werden. Die ist nur dafür da, dem String "fs-rc_9" das entsprechende Zeichen aus der Schriftartdatei zuzuweisen. Und hier ist auch das Problem. In der Schriftartdatei ist nämlich keine 9 enthalten.
Titel: Antw:fhemSVG.css: Icon für rc_9 != Anzeige/Aussage in FTUI
Beitrag von: Leeloo_Dallas am 14 März 2017, 14:14:22
Mir ist nicht ganz klar was Du mit "Schriftartdatei" meinst bzw. was ich ändern muss.
Die Ansicht in FHEM funktioniert ja korrekt.
Beispiel:
Wenn ich in Fhem einem Dummy das Icon zuordne erhalte ich folgende Ansicht zur Auswahl (siehe Anhang) und "rc_9" ist darin enthalten.
Titel: Antw:fhemSVG.css: Icon für rc_9 != Anzeige/Aussage in FTUI
Beitrag von: Standarduser am 14 März 2017, 14:28:54
So, wie die Icons in FTUI (und auch sonst häufig im Netz) genutzt werden, ist SVG nicht geeignet. Im Prinzip werden aus den SVG-Dateien Schriftarten erzeugt, die Du auch in Word/Excel, ... benutzen könntest. Dafür kann man zum Beispiel den Online-Dienst IcoMoon nutzen (https://icomoon.io/app/). IcoMoon kann aber einige der Symbole, oder zumindest Teile davon, nicht lesen, weil offensichtlich in SVG-Dateien eingebettete Buchstaben-/Zahlenbestandteile nicht unterstützt werden. Deshalb ist bei rc_9 nur der Rahmen zusehen, nicht jedoch die Zahl. Es gibt einige Icons, bei denen das so ist.

Um das jetzt zu lösen, müssten einige der in FHEM vorhandenen SVG-Dateien (im Ordner /www/images/fhemSVG/) überabeitet und deren Textbestandteile in Kurven konvertiert werden. Anschließend könnten die Schriftart-Dateien mittels IcoMoon neu generiert werden. Witzigerweise sind die Zahlen 0...8 in Kurven konvertiert wurden, die 9 wurde da wohl vergessen.

Wenn man da jetzt einmal rein reißt, sollte das dann vielleicht auch gleich richtig gemacht werden. Ist auf jeden Fall etwas Arbeit.

Ich denke, Du kommst schneller zum Ziel, wenn Du ein Push-Widget mit einem Kreis drum herum nutzt und Deine Zahlen da direkt hinein schreibst. Das wurde auch erst kürzlich hier irgendwo behandelt.
Titel: Antw:fhemSVG.css: Icon für rc_9 != Anzeige/Aussage in FTUI
Beitrag von: Leeloo_Dallas am 14 März 2017, 14:32:58
Danke für die Erklärungen, wieder was gelernt. :)
Ich werde dann wohl das Ganze mit dem Push-Widget erledigen. Super Tipp !!!
Titel: Antw:fhemSVG.css: Icon für rc_9 != Anzeige/Aussage in FTUI
Beitrag von: Standarduser am 14 März 2017, 15:19:30
Das hier meinte ich:
https://forum.fhem.de/index.php/topic,66800.0.html
Titel: Antw:fhemSVG.css: Icon für rc_9 != Anzeige/Aussage in FTUI
Beitrag von: Leeloo_Dallas am 14 März 2017, 19:53:03
Danke, werde es morgen mal ausprobieren.
Titel: Antw:fhemSVG.css: Icon für rc_9 != Anzeige/Aussage in FTUI
Beitrag von: Leeloo_Dallas am 16 März 2017, 16:39:21
Hab aus Interesse auch mal eine "rc_9.svg" erstellt. => Wer will.... siehe Anhang
Nicht ganz sauber aber darum geht es erstmal nicht.

Wie bekomme ich die Datei nun ins FTUI implementiert?
Ein reines hineinkopieren nach /opt/fhem/www/images/fhemSVG scheint nicht zu funktionieren.
Im FHEM-UI wird die Datei gezogen im FTUI bleibt ein "Viereck" ohne Inhalt.
Titel: Antw:fhemSVG.css: Icon für rc_9 != Anzeige/Aussage in FTUI
Beitrag von: setstate am 16 März 2017, 16:54:09
Siehe Antwort 3
Titel: Antw:fhemSVG.css: Icon für rc_9 != Anzeige/Aussage in FTUI
Beitrag von: Leeloo_Dallas am 16 März 2017, 16:57:24
Zitat von: Standarduser am 14 März 2017, 14:28:54
Um das jetzt zu lösen, müssten einige der in FHEM vorhandenen SVG-Dateien (im Ordner /www/images/fhemSVG/) überabeitet und deren Textbestandteile in Kurven konvertiert werden. Anschließend könnten die Schriftart-Dateien mittels IcoMoon neu generiert werden. Witzigerweise sind die Zahlen 0...8 in Kurven konvertiert wurden, die 9 wurde da wohl vergessen.

Da die 9 wohl vergessen wurde habe ich diese jetzt erstellt, aber wie gehts weiter?
Im Prinzip sollte doch jetzt alles da sein, um die Datei auszutauschen ohne alle Schriftart-Dateien neu Generieren zu müssen.
Bzw. falls der betreffende Entwickler irgendwann zum Generieren kommt, dann kann er ggf. die "rc_9.svg" verwenden.
Titel: Antw:(gelöst) fhemSVG.css: Icon für rc_9 != Anzeige/Aussage in FTUI
Beitrag von: Standarduser am 16 März 2017, 18:46:41
Wenn die SVG jetzt korrekt ist müsste man schon die Schriftart neu generieren, denn du zeigst ja nicht die SVG an, sondern die Schrift
Titel: Antw:fhemSVG.css: Icon für rc_9 != Anzeige/Aussage in FTUI
Beitrag von: Leeloo_Dallas am 17 März 2017, 08:48:34
Moin,
bin gerade dabei mit "IcoMoon" eine neue Schriftart "numbers" zu basteln, damit jeder was davon hat :)
Z.Zt. hängt es noch daran, dass die generierte Schriftart laut "IcoMoon-Demo" korrekt angezeigt wird. Bei der Einbindung in FTUI wird aber nur der "Code" und nicht das "Symbol" angezeigt. (siehe Anhang).

Eine Idee ???

Gruß
Leeloo

P.S.: es sind z.Zt. nur 4 Beispiele (3 von mir / 1 von IcoMoon zum Test), wenn es klappt, dann mache ich den Satz natürlich fertig und stelle es hier zur Verfügung.
Titel: Antw:fhemSVG.css: Icon für rc_9 != Anzeige/Aussage in FTUI
Beitrag von: Standarduser am 17 März 2017, 09:56:59
Das geschieht meist, wenn Schrift nicht gefunden werden konnte, oder CSS falsch definiert wurde.

Ich denke, man könnte sich da an fhemSVG.css orientieren um zu erkennen, wie das korrekt gemacht wird, aber darauf bist Du bistimmt auch selber gekommen  ;)
Titel: Antw:fhemSVG.css: Icon für rc_9 != Anzeige/Aussage in FTUI
Beitrag von: Leeloo_Dallas am 17 März 2017, 11:08:44
Es waren die Pfade und das Fragezeichen + der Rest dahinter.
(siehe dazu: https://forum.fhem.de/index.php/topic,43773.msg447608.html#msg447608 (https://forum.fhem.de/index.php/topic,43773.msg447608.html#msg447608))

Ich werde dann mal den Font fertig machen und hier abstellen.


----> Update:
Im Anhang nun der entsprechende Font (numbers.zip), sowie ein paar Beispiele was sich bereits alles darin befindet. :) 
Viel Spaß damit !!!

Falls die Dateien in den "Standard" übernommen werden können, dann einfach anfragen.

Gruß
Leeloo