FHEM Forum

FHEM => Frontends => TabletUI => Thema gestartet von: Octopus180 am 22 April 2016, 08:14:57

Titel: Anfängerfragen zu Icons
Beitrag von: Octopus180 am 22 April 2016, 08:14:57
Moin Moin

ich beschäftige mich seit ein paar Wochen mit FHEM und Tablet UI. Ich habe schon einige Sachen die für wichtig sind umgesetzt und durch lesen im Foren und Doku´s einiges dazu gelernt. Zurzeit beschäftige ich mich damit für mich ein Tablet UI aufzubauen , damit in der Küche ein Tablet an die Wand kann zum bedienen einiger Geräte.
Jetzt komm ich zu meinen Problem , ich möchte gerne den AB meiner FritzBox über Tablet UI ein/aus schalten. Das habe ich auch schon soweit hin bekommen das die Befehle ausgeführt werden. Natürlich mit man das mit den richtigen Icons versehen. Ich bin beim durchstöbern im Internet auf einer Seite gestossen , der auch seinen AB über Tablet UI schaltet. Er benutzt Icons die mir sehr gefallen.
Ich habe rausgefunden das er Icons mit der Bezeichnung : data-icon="ma-voicemail" benutzt. Ich suche schon seit einer Woche wie ich Icons mit dieser Bezeichnung nutzen kann.

Das gleiche Problem hatte ich auch mit oa-Icons und habe dann heraus gefunden das die Zeile : <link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />  mit in die Index.html muss.

Doch leider finde ich nichts über die ma-Icons.

Ich hätte noch eine zweite Frage , gibt es eigentlich irgendwo eine Auflistung welche Icons es gibt und wie die Bezeichnung ist.

mfg

Peter
Titel: Antw:Anfängerfragen zu Icons
Beitrag von: jnewton957 am 23 April 2016, 15:24:18
Hallo,

die ma-xxx icons sind die von Roman und dort der Kategorie: Material.

Du musst auch hier: <link rel="stylesheet" href="/fhem/tablet/fonts/roman/style.css" /> in die index.html oder deiner Seite übernehmen.

Dann brauchst du natürlich noch die style.css

Die gesamte super Umsetzung von Roman findest du auf: http://ueberueck.com/index.php/fhem-hausautomatisierung/fhem-tablet-ui/ftui-tablet (http://ueberueck.com/index.php/fhem-hausautomatisierung/fhem-tablet-ui/ftui-tablet)

Dort eben die zip Datei downloaden, entpacken und die style.css bei dir unter /fhem/tablet/fonts/roman/ abspeichern.

Ein Verzeichnis aller icons kenne ich nicht. Die meiiten icons findest du auf den Seiten von font-awesome. Dort dann bei Beispiele und du hast 500 icons mit Namen. Fangen alle mit fa- an

Viel Spass weiterhin.

Jörg
Titel: Antw:Anfängerfragen zu Icons
Beitrag von: Octopus180 am 23 April 2016, 15:27:13
Erstmal danke für deine Antwort. Ich werde es mir mal anschauen und schauen ob ich umgesetzt bekomme.

Gruß

Peter
Titel: Antw:Anfängerfragen zu Icons
Beitrag von: roman1528 am 23 April 2016, 18:16:29
Jap richtig..

Leider kann ich dir auf deine Mail nicht antworten, weil die liebe Quälekomm meine Adresse in Ihren Mail-Servern gesperrt hat. Der Anschiss ist schon raus^^

Mail:
Zitat
Moin.

Die "ma" Icons ist ein Custom-Icon-Font. Dazu steht auch was im FHEM-Wiki: FTUI Constum-Fonts ... oder so ähnlich.
Im Anhang findest du eine .ZIP-Datei. Den darin befindlichen Ordner in /tablet/fonts/ entpacken und in die index.html (genau wie bei oa-*) einfügen.

<link rel="stylesheet" href="fonts/material/style.css" />

Eine Demo findest du dort auch: /material/demo.html in deinem Browser öffnen.


Eine Demo der anderen Symbole (fontawesome, fhem, openautomation) gibt es auch. Da mumst du leider mal im Forum suchen. Es gibt ein Script welches die Icon-Fonts ausliest und in eine Demo-Seite verpackt. Bzw. irgendwer hat diese erstellte Demoseite irgnedwo gepostet. Viel  Erfolg. Für die FontAwesome-Icons kannst du aber auch auf http://fortawesome.github.io/Font-Awesome/icons/ nachschauen... die 4.6 Icons sind noch nicht inkludiert! Vor den dort stehenden Namen einfach ein "fa-" hängen^^

Grüße^^

Nützliche links:
http://www.fhemwiki.de/wiki/FHEM_Tablet_UI#Icon-Konfiguration
http://www.fhemwiki.de/wiki/FHEM_Tablet_UI/FAQ#Wie_kann_ich_eigene_Icons_verwenden.3F
Titel: Antw:Anfängerfragen zu Icons
Beitrag von: Octopus180 am 23 April 2016, 18:26:41
Hallo Jörg und Roman , nachdem ihr mir erklärt habt wo ich suchen , habe ich die Dateien in mein System eingebunden und so verändert das jetzt alles funktioniert. Vielen Dank für eure Hilfe

Gruß

Peter