Skip to content
  • Home
  • 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
ioBroker Logo

Community Forum

donate donate
  1. ioBroker Community Home
  2. Deutsch
  3. Entwicklung
  4. [Neuer VIS-Adpater] Material Design Widgets

NEWS

  • Monatsrückblick Januar/Februar 2026 ist online!
    BluefoxB
    Bluefox
    16
    1
    237

  • Jahresrückblick 2025 – unser neuer Blogbeitrag ist online! ✨
    BluefoxB
    Bluefox
    17
    1
    4.5k

  • Neuer Blogbeitrag: Monatsrückblick - Dezember 2025 🎄
    BluefoxB
    Bluefox
    13
    1
    1.3k

[Neuer VIS-Adpater] Material Design Widgets

Scheduled Pinned Locked Moved Entwicklung
adapter
271 Posts 30 Posters 56.9k Views 43 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.
  • BluefoxB Bluefox

    @Scrounger

    Weiß jemand wer die Hoheit über iobroker.click hat?

    Wieso?

    sigi234S Online
    sigi234S Online
    sigi234
    Forum Testing Most Active
    wrote on last edited by
    #255

    @Bluefox sagte in [Neuer VIS-Adpater] Material Design Widgets:

    @Scrounger

    Weiß jemand wer die Hoheit über iobroker.click hat?

    Wieso?

    https://forum.iobroker.net/topic/25374/neuer-vis-adpater-material-design-widgets/214?page=3

    Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.
    Immer Daten sichern!

    1 Reply Last reply
    0
    • MeistertrM Offline
      MeistertrM Offline
      Meistertr
      Developer
      wrote on last edited by
      #256

      @Scrounger ich habe auf den verschieden seiten im menu elemente die ich zum beispiel mit calc(100% -xxx px) an der rechten Seite fixiere, sieht im editor auch gut aus, aber im betrieb sind die Elemente dann verschwunden oder besser gesagt aus dem Bild verschoben...

      ScroungerS 1 Reply Last reply
      0
      • BluefoxB Bluefox

        @Scrounger

        Weiß jemand wer die Hoheit über iobroker.click hat?

        Wieso?

        ScroungerS Offline
        ScroungerS Offline
        Scrounger
        Developer
        wrote on last edited by
        #257

        @Bluefox sagte in [Neuer VIS-Adpater] Material Design Widgets:

        Wieso?

        Würde gerne ein Beispiel Projekt anlegen, hilft sicher vielen beim Konfigurieren des Adapters.

        @sigi234 sagte in [Neuer VIS-Adpater] Material Design Widgets:

        0.1.5

        aktueller master hat die Version 1.6.0, da hab ich die von Dir beschriebenen Punkte auch gefixt.

        @Meistertr sagte in [Neuer VIS-Adpater] Material Design Widgets:

        @Scrounger ich habe auf den verschieden seiten im menu elemente die ich zum beispiel mit calc(100% -xxx px) an der rechten Seite fixiere, sieht im editor auch gut aus, aber im betrieb sind die Elemente dann verschwunden oder besser gesagt aus dem Bild verschoben...

        Mach mal bitte nen export von der view und screenshot wo du das eingestellt hast. Versteh es so leider nicht.

        sigi234S 1 Reply Last reply
        0
        • ScroungerS Scrounger

          @Bluefox sagte in [Neuer VIS-Adpater] Material Design Widgets:

          Wieso?

          Würde gerne ein Beispiel Projekt anlegen, hilft sicher vielen beim Konfigurieren des Adapters.

          @sigi234 sagte in [Neuer VIS-Adpater] Material Design Widgets:

          0.1.5

          aktueller master hat die Version 1.6.0, da hab ich die von Dir beschriebenen Punkte auch gefixt.

          @Meistertr sagte in [Neuer VIS-Adpater] Material Design Widgets:

          @Scrounger ich habe auf den verschieden seiten im menu elemente die ich zum beispiel mit calc(100% -xxx px) an der rechten Seite fixiere, sieht im editor auch gut aus, aber im betrieb sind die Elemente dann verschwunden oder besser gesagt aus dem Bild verschoben...

          Mach mal bitte nen export von der view und screenshot wo du das eingestellt hast. Versteh es so leider nicht.

          sigi234S Online
          sigi234S Online
          sigi234
          Forum Testing Most Active
          wrote on last edited by sigi234
          #258

          @Scrounger sagte in [Neuer VIS-Adpater] Material Design Widgets:

          aktueller master hat die Version 1.6.0, da hab ich die von Dir beschriebenen Punkte auch gefixt.

          Komme nicht auf die 1.6.0

          Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.
          Immer Daten sichern!

          ScroungerS 1 Reply Last reply
          0
          • sigi234S sigi234

            @Scrounger sagte in [Neuer VIS-Adpater] Material Design Widgets:

            aktueller master hat die Version 1.6.0, da hab ich die von Dir beschriebenen Punkte auch gefixt.

            Komme nicht auf die 1.6.0

            ScroungerS Offline
            ScroungerS Offline
            Scrounger
            Developer
            wrote on last edited by Scrounger
            #259

            @sigi234 sagte in [Neuer VIS-Adpater] Material Design Widgets:

            Komme nicht auf die 1.6.0

            Dann versuch mal bitte folgendes -schritt für schritt:

            • vis-materialdesign deinstallieren
            • Ordner \ioBroker\iobroker-data\files\vis\widgets\materialdesign\ löschen
            • Datei \ioBroker\iobroker-data\files\vis\widgets\materialdesign.html löschen
            • Ordner \ioBroker\node_modules\iobroker.vis\www\widgets\materialdesign\ löschen
            • Datei D:\Projekte\ioBroker\node_modules\iobroker.vis\www\widgets\materialdesign.html löschen
            • iobroker restart
            • vis-materialdesign installieren
            • Befehl iobroker upload vis ausführen
            • iobroker restart

            Dadurch hast dann nur noch die aktuelle version drauf und es sichergestellt das da keine "Leichen" mehr sind.

            sigi234S 2 Replies Last reply
            0
            • ScroungerS Scrounger

              @sigi234 sagte in [Neuer VIS-Adpater] Material Design Widgets:

              Komme nicht auf die 1.6.0

              Dann versuch mal bitte folgendes -schritt für schritt:

              • vis-materialdesign deinstallieren
              • Ordner \ioBroker\iobroker-data\files\vis\widgets\materialdesign\ löschen
              • Datei \ioBroker\iobroker-data\files\vis\widgets\materialdesign.html löschen
              • Ordner \ioBroker\node_modules\iobroker.vis\www\widgets\materialdesign\ löschen
              • Datei D:\Projekte\ioBroker\node_modules\iobroker.vis\www\widgets\materialdesign.html löschen
              • iobroker restart
              • vis-materialdesign installieren
              • Befehl iobroker upload vis ausführen
              • iobroker restart

              Dadurch hast dann nur noch die aktuelle version drauf und es sichergestellt das da keine "Leichen" mehr sind.

              sigi234S Online
              sigi234S Online
              sigi234
              Forum Testing Most Active
              wrote on last edited by
              #260

              @Scrounger sagte in [Neuer VIS-Adpater] Material Design Widgets:

              Dadurch hast dann nur noch die aktuelle version drauf und es sichergestellt das da keine "Leichen" mehr sind.

              Ist dann meine schon erstellte View weg? Kann ich die wo sichern? View exportieren und importieren geht das?

              Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.
              Immer Daten sichern!

              ScroungerS 1 Reply Last reply
              0
              • MeistertrM Offline
                MeistertrM Offline
                Meistertr
                Developer
                wrote on last edited by
                #261

                @Scrounger 2019-10-28_21h53_02.png

                hier der view:

                {
                  "settings": {
                    "style": {},
                    "theme": "redmond",
                    "sizex": "",
                    "sizey": "",
                    "gridSize": "",
                    "useBackground": false,
                    "snapType": null
                  },
                  "widgets": {
                    "e00001": {
                      "tpl": "tplHtml",
                      "data": {
                        "g_fixed": false,
                        "g_visibility": false,
                        "g_css_font_text": false,
                        "g_css_background": true,
                        "g_css_shadow_padding": false,
                        "g_css_border": false,
                        "g_gestures": false,
                        "g_signals": false,
                        "g_last_change": false,
                        "visibility-cond": "==",
                        "visibility-val": 1,
                        "visibility-groups-action": "hide",
                        "refreshInterval": "0",
                        "signals-cond-0": "==",
                        "signals-val-0": true,
                        "signals-icon-0": "/vis/signals/lowbattery.png",
                        "signals-icon-size-0": 0,
                        "signals-blink-0": false,
                        "signals-horz-0": 0,
                        "signals-vert-0": 0,
                        "signals-hide-edit-0": false,
                        "signals-cond-1": "==",
                        "signals-val-1": true,
                        "signals-icon-1": "/vis/signals/lowbattery.png",
                        "signals-icon-size-1": 0,
                        "signals-blink-1": false,
                        "signals-horz-1": 0,
                        "signals-vert-1": 0,
                        "signals-hide-edit-1": false,
                        "signals-cond-2": "==",
                        "signals-val-2": true,
                        "signals-icon-2": "/vis/signals/lowbattery.png",
                        "signals-icon-size-2": 0,
                        "signals-blink-2": false,
                        "signals-horz-2": 0,
                        "signals-vert-2": 0,
                        "signals-hide-edit-2": false,
                        "lc-type": "last-change",
                        "lc-is-interval": true,
                        "lc-is-moment": false,
                        "lc-format": "",
                        "lc-position-vert": "top",
                        "lc-position-horz": "right",
                        "lc-offset-vert": 0,
                        "lc-offset-horz": 0,
                        "lc-font-size": "12px",
                        "lc-font-family": "",
                        "lc-font-style": "",
                        "lc-bkg-color": "",
                        "lc-color": "",
                        "lc-border-width": "0",
                        "lc-border-style": "",
                        "lc-border-color": "",
                        "lc-border-radius": 10,
                        "lc-zindex": 0
                      },
                      "style": {
                        "left": "calc(100% - 216px)",
                        "top": "109px",
                        "background-color": "#d10000",
                        "width": "200px",
                        "height": "100px"
                      },
                      "widgetSet": "basic"
                    },
                    "e00002": {
                      "tpl": "tplHtml",
                      "data": {
                        "g_fixed": false,
                        "g_visibility": false,
                        "g_css_font_text": false,
                        "g_css_background": true,
                        "g_css_shadow_padding": false,
                        "g_css_border": false,
                        "g_gestures": false,
                        "g_signals": false,
                        "g_last_change": false,
                        "visibility-cond": "==",
                        "visibility-val": 1,
                        "visibility-groups-action": "hide",
                        "refreshInterval": "0",
                        "signals-cond-0": "==",
                        "signals-val-0": true,
                        "signals-icon-0": "/vis/signals/lowbattery.png",
                        "signals-icon-size-0": 0,
                        "signals-blink-0": false,
                        "signals-horz-0": 0,
                        "signals-vert-0": 0,
                        "signals-hide-edit-0": false,
                        "signals-cond-1": "==",
                        "signals-val-1": true,
                        "signals-icon-1": "/vis/signals/lowbattery.png",
                        "signals-icon-size-1": 0,
                        "signals-blink-1": false,
                        "signals-horz-1": 0,
                        "signals-vert-1": 0,
                        "signals-hide-edit-1": false,
                        "signals-cond-2": "==",
                        "signals-val-2": true,
                        "signals-icon-2": "/vis/signals/lowbattery.png",
                        "signals-icon-size-2": 0,
                        "signals-blink-2": false,
                        "signals-horz-2": 0,
                        "signals-vert-2": 0,
                        "signals-hide-edit-2": false,
                        "lc-type": "last-change",
                        "lc-is-interval": true,
                        "lc-is-moment": false,
                        "lc-format": "",
                        "lc-position-vert": "top",
                        "lc-position-horz": "right",
                        "lc-offset-vert": 0,
                        "lc-offset-horz": 0,
                        "lc-font-size": "12px",
                        "lc-font-family": "",
                        "lc-font-style": "",
                        "lc-bkg-color": "",
                        "lc-color": "",
                        "lc-border-width": "0",
                        "lc-border-style": "",
                        "lc-border-color": "",
                        "lc-border-radius": 10,
                        "lc-zindex": 0
                      },
                      "style": {
                        "left": "50%",
                        "top": "229px",
                        "background-color": "#d10000",
                        "width": "200px",
                        "height": "100px"
                      },
                      "widgetSet": "basic"
                    }
                  },
                  "name": "test",
                  "filterList": []
                }
                
                1 Reply Last reply
                0
                • ScroungerS Scrounger

                  @sigi234 sagte in [Neuer VIS-Adpater] Material Design Widgets:

                  Komme nicht auf die 1.6.0

                  Dann versuch mal bitte folgendes -schritt für schritt:

                  • vis-materialdesign deinstallieren
                  • Ordner \ioBroker\iobroker-data\files\vis\widgets\materialdesign\ löschen
                  • Datei \ioBroker\iobroker-data\files\vis\widgets\materialdesign.html löschen
                  • Ordner \ioBroker\node_modules\iobroker.vis\www\widgets\materialdesign\ löschen
                  • Datei D:\Projekte\ioBroker\node_modules\iobroker.vis\www\widgets\materialdesign.html löschen
                  • iobroker restart
                  • vis-materialdesign installieren
                  • Befehl iobroker upload vis ausführen
                  • iobroker restart

                  Dadurch hast dann nur noch die aktuelle version drauf und es sichergestellt das da keine "Leichen" mehr sind.

                  sigi234S Online
                  sigi234S Online
                  sigi234
                  Forum Testing Most Active
                  wrote on last edited by sigi234
                  #262

                  @Scrounger sagte in [Neuer VIS-Adpater] Material Design Widgets:

                  Dadurch hast dann nur noch die aktuelle version drauf und es sichergestellt das da keine "Leichen" mehr sind.

                  Erledigt, Fehler noch da, V 1.5.0

                  Hinweis:
                  Habe VIS Version 1.2.2

                  Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.
                  Immer Daten sichern!

                  1 Reply Last reply
                  0
                  • sigi234S sigi234

                    @Scrounger sagte in [Neuer VIS-Adpater] Material Design Widgets:

                    Dadurch hast dann nur noch die aktuelle version drauf und es sichergestellt das da keine "Leichen" mehr sind.

                    Ist dann meine schon erstellte View weg? Kann ich die wo sichern? View exportieren und importieren geht das?

                    ScroungerS Offline
                    ScroungerS Offline
                    Scrounger
                    Developer
                    wrote on last edited by Scrounger
                    #263

                    Aktuellen master direkt von gut gezogen?

                    Hab auch die 1.2.2. geht auf beiden Systemen.

                    sigi234S 1 Reply Last reply
                    0
                    • ScroungerS Scrounger

                      Aktuellen master direkt von gut gezogen?

                      Hab auch die 1.2.2. geht auf beiden Systemen.

                      sigi234S Online
                      sigi234S Online
                      sigi234
                      Forum Testing Most Active
                      wrote on last edited by sigi234
                      #264

                      @Scrounger sagte in [Neuer VIS-Adpater] Material Design Widgets:

                      Aktuellen master direkt von gut gezogen?

                      Hab auch die 1.2.2. geht auf beiden Systemen.

                      https://github.com/Scrounger/iobroker.vis-materialdesign

                      So installiert:

                      Screenshot (437).png

                      Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.
                      Immer Daten sichern!

                      ScroungerS 1 Reply Last reply
                      0
                      • sigi234S sigi234

                        @Scrounger sagte in [Neuer VIS-Adpater] Material Design Widgets:

                        Aktuellen master direkt von gut gezogen?

                        Hab auch die 1.2.2. geht auf beiden Systemen.

                        https://github.com/Scrounger/iobroker.vis-materialdesign

                        So installiert:

                        Screenshot (437).png

                        ScroungerS Offline
                        ScroungerS Offline
                        Scrounger
                        Developer
                        wrote on last edited by
                        #265

                        @sigi234
                        Kannst du Mal bitte die komplette console Posten.

                        sigi234S 1 Reply Last reply
                        0
                        • ScroungerS Scrounger

                          @sigi234
                          Kannst du Mal bitte die komplette console Posten.

                          sigi234S Online
                          sigi234S Online
                          sigi234
                          Forum Testing Most Active
                          wrote on last edited by sigi234
                          #266

                          @Scrounger sagte in [Neuer VIS-Adpater] Material Design Widgets:

                          @sigi234
                          Kannst du Mal bitte die komplette console Posten.

                          Und wie? Du meinst die von F12

                          Hast du Team Viewer?

                          Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.
                          Immer Daten sichern!

                          ScroungerS 1 Reply Last reply
                          0
                          • sigi234S sigi234

                            @Scrounger sagte in [Neuer VIS-Adpater] Material Design Widgets:

                            @sigi234
                            Kannst du Mal bitte die komplette console Posten.

                            Und wie? Du meinst die von F12

                            Hast du Team Viewer?

                            ScroungerS Offline
                            ScroungerS Offline
                            Scrounger
                            Developer
                            wrote on last edited by
                            #267

                            @sigi234
                            Bei Firefox gibts ne export funktion, alles markieren müsste aber auch gehen.

                            Hab grad nochmal ein fix hochgeladen -> 1.7.0. Bitte nochmal testen und die schritte von
                            https://forum.iobroker.net/topic/25374/neuer-vis-adpater-material-design-widgets/260 nochmal durchführen.

                            sigi234S 1 Reply Last reply
                            0
                            • ScroungerS Scrounger

                              @sigi234
                              Bei Firefox gibts ne export funktion, alles markieren müsste aber auch gehen.

                              Hab grad nochmal ein fix hochgeladen -> 1.7.0. Bitte nochmal testen und die schritte von
                              https://forum.iobroker.net/topic/25374/neuer-vis-adpater-material-design-widgets/260 nochmal durchführen.

                              sigi234S Online
                              sigi234S Online
                              sigi234
                              Forum Testing Most Active
                              wrote on last edited by sigi234
                              #268

                              @Scrounger sagte in [Neuer VIS-Adpater] Material Design Widgets:

                              @sigi234
                              Bei Firefox gibts ne export funktion, alles markieren müsste aber auch gehen.

                              Hab grad nochmal ein fix hochgeladen -> 1.7.0. Bitte nochmal testen und die schritte von
                              https://forum.iobroker.net/topic/25374/neuer-vis-adpater-material-design-widgets/260 nochmal durchführen.

                              Keine Änderung.

                              Laut Bild ist V 1.0.7 installiert

                              Screenshot (440).png

                              Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.
                              Immer Daten sichern!

                              1 Reply Last reply
                              0
                              • MeistertrM Meistertr

                                @Scrounger ich habe auf den verschieden seiten im menu elemente die ich zum beispiel mit calc(100% -xxx px) an der rechten Seite fixiere, sieht im editor auch gut aus, aber im betrieb sind die Elemente dann verschwunden oder besser gesagt aus dem Bild verschoben...

                                ScroungerS Offline
                                ScroungerS Offline
                                Scrounger
                                Developer
                                wrote on last edited by Scrounger
                                #269

                                @Meistertr sagte in [Neuer VIS-Adpater] Material Design Widgets:

                                @Scrounger ich habe auf den verschieden seiten im menu elemente die ich zum beispiel mit calc(100% -xxx px) an der rechten Seite fixiere, sieht im editor auch gut aus, aber im betrieb sind die Elemente dann verschwunden oder besser gesagt aus dem Bild verschoben...

                                Das geht leider nicht. Weil wenn ich es umstelle, dann wird die TopAppBar immer beim scrollen verschwinden. d.h. man muss leider mit absoluten position arbeiten, da sonst dieses konzept nicht mehr funktioniert:

                                position.gif

                                Ich hab hier etwas getrickst. Das würde korrekt funktionieren (inkl. der Android bekannten scrolling effekte), wenn das Widget 8 eine echte scrollbar hätte, meines Wissens nach hat es das nicht

                                1 Reply Last reply
                                0
                                • ScroungerS Scrounger

                                  Hallo zusammen,
                                  ich arbeite aktuell an einem VIS-Adapter, der auf Google material components web Bibliothek basiert und "echte" Material Widgets zur Verfügung stellt inkl. der entsprechenden Effekt, wie Overlay, ripple, etc.

                                  Aktuell ist der Adapter noch nicht im latest, da ich noch sehr viel daran arbeitet. Wer testen möchte muss direkt von github installieren: https://github.com/Scrounger/iobroker.vis-materialdesign

                                  Folgende Elemente sind bereits enthalten:
                                  tmp.png

                                  Da das mein erster VIS Adapter ist, benötige ich etwas Unterstützung bei der weiteren Entwicklung und natürlich Euer Feedback vom testen.

                                  Aktuelle hab ich folgende Probleme:

                                  • Wie muss ich den Pfad <link rel="stylesheet" href="widgets/materialdesign/css/material-components-web.css" /> ändern, so das er direkt auf node_modules/material-components-web geht und ich nicht die dateien bei einem update manuell kopieren muss?
                                  • Gibt es eine Möglichkeit programatisch die styling felder im vis zu befüllen? Also ich würde gerne z.B. Font color und text-align vorbefüllen. font.png
                                  • Kann einer der Pros hier den vertikalen Slider bauen, da ich es leider nicht hinbekomme?

                                  paypal

                                  sigi234S Online
                                  sigi234S Online
                                  sigi234
                                  Forum Testing Most Active
                                  wrote on last edited by sigi234
                                  #270

                                  @Scrounger

                                  Guten Morgen,
                                  ich habe beim Netzwerktraffic eine großen Wert ( 5.000.000.000 Byte)
                                  Mir fehlt beim Wert die Möglichkeit zu mutiplizieren. Also Wert mal 9.53674E-10 ergibt dann 500 GB

                                  Gelöst, hab ein basic-Number Widget genommen und eingefügt.

                                  Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.
                                  Immer Daten sichern!

                                  1 Reply Last reply
                                  0
                                  • Jey CeeJ Online
                                    Jey CeeJ Online
                                    Jey Cee
                                    Developer
                                    wrote on last edited by
                                    #271

                                    Hier geht es für die Test version von Github weiter.

                                    Wenn es Themen zur Verwendung der Stable Version gibt macht ein Thema in der Kategorie Visualisierung auf.
                                    Bei Problemen oder Fehlermeldungen verwendet bitte die Kategorie Error/Bug.

                                    Bitte Folgt Scrounger um über neue Themen von ihm informiert zu werden.

                                    Persönlicher Support
                                    Spenden -> paypal.me/J3YC33

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


                                    Support us

                                    ioBroker
                                    Community Adapters
                                    Donate

                                    565

                                    Online

                                    32.7k

                                    Users

                                    82.5k

                                    Topics

                                    1.3m

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

                                    • Don't have an account? Register

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