Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Visualisierung
    4. Widgets mit Icon Fonts

    NEWS

    • Monatsrückblick – September 2025

    • Neues Video "KI im Smart Home" - ioBroker plus n8n

    • Neues Video über Aliase, virtuelle Geräte und Kategorien

    Widgets mit Icon Fonts

    This topic has been deleted. Only users with topic management privileges can see it.
    • Z
      zap Developer last edited by

      Hallo,

      mein erster Beitrag im Forum. Ich hoffe, ich falle nicht gleich negativ auf mit meiner Frage.

      Ich bin gerade dabei, meine Smarthome Umgebung von FHEM nach ioBroker zu migrieren. Die Geräte habe ich soweit alle in ioBroker abbilden können.

      Beim Erstellen der VIS Views habe ich nun das Problem, dass bei den Widget die Farbe der Icons nicht geändert werden kann. Einige Nutzer machen das anscheinend per Photoshop oder anderem Tool, ist mir aber ehrlich gesagt zu aufwändig und v.a. zu statisch. Grund für diese Problematik ist wohl, dass für die Widgets Bilder verwendet werden und keine Symbole aus Icon-Fonts. Warum ist das so? Gibt es irgendwelche technischen Gründe in ioBroker, die die Verwendung von Symbolen aus Icon-Fonts verhindern? Bzw. muss ich irgendwelche Nachteile in Kauf nehmen, wenn ich Icon-Fonts in Widgets verwende?

      Ich habe das jetzt mal testweise für ein Button-Widget umgesetzt. D.h. ich habe

      • Den Google Material Icon Font per VIS Dateimanager hochgeladen

      • In der global Section des Views die notwendige CSS Klasse definiert und den Font eingebunden

      Dann im Widget kein Bild ausgewählt, sondern als Button-Text folgenden HTML Code eingegeben:

      face
      

      Funktioniert einwandfrei, wenn auch die Definition etwas sperrig ist. Dabei ist "face" der Name des darzustellenden Symbols aus dem Icon-Font. Vorteil: Man kann die Attribute des Symbols wie z.B. die Farbe nun problemlos im VIS Editor ändern.

      Mir ist klar, dass die Umstellung der Widgets auf Icon-Fonts viel Aufwand ist. Wenn technisch nichts dagegen spricht, könnte ich mir vorstellen, einige der Widgets zusätzlich mit Symbolen bereitzustellen.

      Interessante Fonts gibt es jedenfalls genug. Neben dem Material Font z.B. Font-Awesome und Flaticon.

      1 Reply Last reply Reply Quote 0
      • Bluefox
        Bluefox last edited by

        vis wurde in der Zeiten angefangen, wann noch IE6 und iPad 1 aktuell waren.

        Jetzt konnte man sich so was vorstellen.

        1 Reply Last reply Reply Quote 0
        • First post
          Last post

        Support us

        ioBroker
        Community Adapters
        Donate

        755
        Online

        32.1k
        Users

        80.8k
        Topics

        1.3m
        Posts

        2
        2
        536
        Loading More Posts
        • Oldest to Newest
        • Newest to Oldest
        • Most Votes
        Reply
        • Reply as topic
        Log in to reply
        Community
        Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
        The ioBroker Community 2014-2023
        logo