Skip to content
  • 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
Logo
  1. ioBroker Community Home
  2. Deutsch
  3. Entwicklung
  4. [Neuer VIS-Adpater] Material Design Widgets

NEWS

  • Wartung am 15.11. – Forum ab 22:00 Uhr nicht erreichbar
    BluefoxB
    Bluefox
    12
    2
    267

  • UPDATE 31.10.: Amazon Alexa - ioBroker Skill läuft aus ?
    apollon77A
    apollon77
    48
    3
    8.0k

  • Monatsrückblick – September 2025
    BluefoxB
    Bluefox
    13
    1
    1.7k

[Neuer VIS-Adpater] Material Design Widgets

[Neuer VIS-Adpater] Material Design Widgets

Scheduled Pinned Locked Moved Entwicklung
adapter
271 Posts 30 Posters 50.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.
  • D Offline
    D Offline
    dos1973
    wrote on last edited by
    #21

    bei mir läuft er auch im Fully.
    hat echt Potenzial, sieht sehr "schick" aus. Ich konnte alle auch die Slider reinziehen, konfigurieren und funktionieren auch. HUE->level

    die Top Bar funktioniert zwar noch nicht, aber diese Menüführung wäre Klasse!

    sigi234S 1 Reply Last reply
    0
    • ScroungerS Offline
      ScroungerS Offline
      Scrounger
      Developer
      wrote on last edited by
      #22

      Hab die Top App Bar mit Navigationsleiste implementiert, auf basis des "view in widget 8" widget vom vis Adapter.

      folgende wichtigen Infos dazu, weil die nur so funtkioniert:

      • Position ist fix (hardcoded), d.h. die App Bar ist immer in der oberen linken Ecke. Man kann nur Höhe und Breite einstellen. Deshalb heißt sie ja auch Top App Bar 😉
      • Im Editor werden Effekte, wie scrollen, etc. nicht korrekt dargestellt.
      • Checkbox 'persitent' (Dauernd) muss aktiviert sein.

      Es gibt drei layouts:

      1. modal:
        topappbar_modal.gif

      2. dismissible:
        topappbar_dismissible.gif

      3. permanent:
        topappbar_permanent.gif

      Falls noch weitere konfigurations optionen gewünscht werden, dann bitte hier posten oder ein issue bei github aufmachen.

      Viel Spaß beim testen 🙂

      <a href="https://github.com/Scrounger/ioBroker.linkeddevices">LinkedDevices Adapter</a>

      <a href="https://github.com/Scrounger/ioBroker.vis-materialdesign">Material Design Widgets</a>

      sigi234S 1 Reply Last reply
      0
      • D dos1973

        bei mir läuft er auch im Fully.
        hat echt Potenzial, sieht sehr "schick" aus. Ich konnte alle auch die Slider reinziehen, konfigurieren und funktionieren auch. HUE->level

        die Top Bar funktioniert zwar noch nicht, aber diese Menüführung wäre Klasse!

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

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

        die Top Bar funktioniert zwar noch nicht, aber diese Menüführung wäre Klasse!

        Wo ist die Top Bar? Ist das ein eigenes Widget?

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

        ScroungerS 1 Reply Last reply
        0
        • sigi234S sigi234

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

          die Top Bar funktioniert zwar noch nicht, aber diese Menüführung wäre Klasse!

          Wo ist die Top Bar? Ist das ein eigenes Widget?

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

          @sigi234
          Ja ist ein eigenes Widget.

          topbar.png

          <a href="https://github.com/Scrounger/ioBroker.linkeddevices">LinkedDevices Adapter</a>

          <a href="https://github.com/Scrounger/ioBroker.vis-materialdesign">Material Design Widgets</a>

          GlasfaserG 1 Reply Last reply
          0
          • ScroungerS Scrounger

            Hab die Top App Bar mit Navigationsleiste implementiert, auf basis des "view in widget 8" widget vom vis Adapter.

            folgende wichtigen Infos dazu, weil die nur so funtkioniert:

            • Position ist fix (hardcoded), d.h. die App Bar ist immer in der oberen linken Ecke. Man kann nur Höhe und Breite einstellen. Deshalb heißt sie ja auch Top App Bar 😉
            • Im Editor werden Effekte, wie scrollen, etc. nicht korrekt dargestellt.
            • Checkbox 'persitent' (Dauernd) muss aktiviert sein.

            Es gibt drei layouts:

            1. modal:
              topappbar_modal.gif

            2. dismissible:
              topappbar_dismissible.gif

            3. permanent:
              topappbar_permanent.gif

            Falls noch weitere konfigurations optionen gewünscht werden, dann bitte hier posten oder ein issue bei github aufmachen.

            Viel Spaß beim testen 🙂

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

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

            Falls noch weitere konfigurations optionen gewünscht werden, dann bitte hier posten oder ein issue bei github aufmachen.

            Einer der Besten Adapter! 👍

            Wünsche:

            • Navigationsleiste Trennlinien Farbe einstellbar

            • Bei allen Farben transparent auswählbar

            • Schriftart einstellbar

            Danke vorerst.😀

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

            ScroungerS 1 Reply Last reply
            1
            • ScroungerS Scrounger

              @sigi234
              Ja ist ein eigenes Widget.

              topbar.png

              GlasfaserG Offline
              GlasfaserG Offline
              Glasfaser
              wrote on last edited by Glasfaser
              #26

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

              @sigi234
              Ja ist ein eigenes Widget.

              topbar.png

              Bei mir sieht es so aus , das Widget " Top Bar " ist kaum zu erkennen ( Version 0.0.6 )
              Ist das richtig so !?

              ( bei jedem Browser )

              1.JPG

              Synology 918+ 16GB - ioBroker in Docker v9 , VISO auf Trekstor Primebook C13 13,3" , Hikvision Domkameras mit Surveillance Station .. CCU RaspberryMatic in Synology VM .. Zigbee CC2538+CC2592 .. Sonoff .. KNX .. Modbus ..

              1 Reply Last reply
              0
              • sigi234S sigi234

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

                Falls noch weitere konfigurations optionen gewünscht werden, dann bitte hier posten oder ein issue bei github aufmachen.

                Einer der Besten Adapter! 👍

                Wünsche:

                • Navigationsleiste Trennlinien Farbe einstellbar

                • Bei allen Farben transparent auswählbar

                • Schriftart einstellbar

                Danke vorerst.😀

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

                @sigi234

                • Navigationsleiste Trennlinien Farbe einstellbar

                Sachdienlicher Hinweise 😉 Mach ich rein

                • Bei allen Farben transparent auswählbar

                Geht schon, musst einfach 'transparent' im color feld schreiben oder 'rgba(0, 0, 0, 0.37)' dort reinschreiben

                • Schriftart einstellbar

                Geht auch schon, siehe "Listenelemente Schriftgröße"
                Clipboard02.png

                Alternativ kann man mit html tags für jedes Listenelement eine eigen schriftgröße, Frabe, Fett, kursiv etc. definieren, Beispiel: '<font size="13"><i>Hallo</></font>'

                <a href="https://github.com/Scrounger/ioBroker.linkeddevices">LinkedDevices Adapter</a>

                <a href="https://github.com/Scrounger/ioBroker.vis-materialdesign">Material Design Widgets</a>

                sigi234S 1 Reply Last reply
                0
                • ScroungerS Scrounger

                  @sigi234

                  • Navigationsleiste Trennlinien Farbe einstellbar

                  Sachdienlicher Hinweise 😉 Mach ich rein

                  • Bei allen Farben transparent auswählbar

                  Geht schon, musst einfach 'transparent' im color feld schreiben oder 'rgba(0, 0, 0, 0.37)' dort reinschreiben

                  • Schriftart einstellbar

                  Geht auch schon, siehe "Listenelemente Schriftgröße"
                  Clipboard02.png

                  Alternativ kann man mit html tags für jedes Listenelement eine eigen schriftgröße, Frabe, Fett, kursiv etc. definieren, Beispiel: '<font size="13"><i>Hallo</></font>'

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

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

                  @sigi234

                  • Schriftart einstellbar

                  Geht auch schon, siehe "Listenelemente Schriftgröße"

                  Ups da habe ich mich Falsch ausgedrückt, ich meinte Font-Family

                  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

                    • Schriftart einstellbar

                    Geht auch schon, siehe "Listenelemente Schriftgröße"

                    Ups da habe ich mich Falsch ausgedrückt, ich meinte Font-Family

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

                    @sigi234
                    Achso das geht natürlich auch mit html tag, z.B. '<font face="verdana">Hallo</font>.
                    Aber stimmt ein Fled wo man das für alle Listenelemente setzen kann wäre natürlich komfortabler - schau ich mir an.

                    <a href="https://github.com/Scrounger/ioBroker.linkeddevices">LinkedDevices Adapter</a>

                    <a href="https://github.com/Scrounger/ioBroker.vis-materialdesign">Material Design Widgets</a>

                    sigi234S 1 Reply Last reply
                    0
                    • ScroungerS Scrounger

                      @sigi234
                      Achso das geht natürlich auch mit html tag, z.B. '<font face="verdana">Hallo</font>.
                      Aber stimmt ein Fled wo man das für alle Listenelemente setzen kann wäre natürlich komfortabler - schau ich mir an.

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

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

                      @sigi234
                      Achso das geht natürlich auch mit html tag, z.B. '<font face="verdana">Hallo</font>.
                      Aber stimmt ein Fled wo man das für alle Listenelemente setzen kann wäre natürlich komfortabler - schau ich mir an.

                      Super, noch einige Fragen, wie kann ich die Menüfarbe (Hintergrund derzeit Blau) oben Links ändern?
                      Die Schriftfarbe bei den Navigationsleisten Überschrift ist Schwarz, kann ich die auch ändern? Ich glaube die ist mit den Trennlinien verbunden.

                      Screenshot (192).png

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

                      H ScroungerS 2 Replies Last reply
                      0
                      • sigi234S sigi234

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

                        @sigi234
                        Achso das geht natürlich auch mit html tag, z.B. '<font face="verdana">Hallo</font>.
                        Aber stimmt ein Fled wo man das für alle Listenelemente setzen kann wäre natürlich komfortabler - schau ich mir an.

                        Super, noch einige Fragen, wie kann ich die Menüfarbe (Hintergrund derzeit Blau) oben Links ändern?
                        Die Schriftfarbe bei den Navigationsleisten Überschrift ist Schwarz, kann ich die auch ändern? Ich glaube die ist mit den Trennlinien verbunden.

                        Screenshot (192).png

                        H Offline
                        H Offline
                        heinzie
                        wrote on last edited by
                        #31

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

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

                        @sigi234
                        Achso das geht natürlich auch mit html tag, z.B. '<font face="verdana">Hallo</font>.
                        Aber stimmt ein Fled wo man das für alle Listenelemente setzen kann wäre natürlich komfortabler - schau ich mir an.

                        Super, noch einige Fragen, wie kann ich die Menüfarbe (Hintergrund derzeit Blau) oben Links ändern?
                        Die Schriftfarbe bei den Navigationsleisten Überschrift ist Schwarz, kann ich die auch ändern? Ich glaube die ist mit den Trennlinien verbunden.

                        Screenshot (192).png

                        @Scrounger

                        Könntest Du vielleicht einmal deinen aktuellen Stand als export zur Verfügung stellen. Stehe da irgendwie noch auf dem Schlauch, mit einem Beispiel ist das immer wesentlich einfacher

                        1 Reply Last reply
                        0
                        • sigi234S sigi234

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

                          @sigi234
                          Achso das geht natürlich auch mit html tag, z.B. '<font face="verdana">Hallo</font>.
                          Aber stimmt ein Fled wo man das für alle Listenelemente setzen kann wäre natürlich komfortabler - schau ich mir an.

                          Super, noch einige Fragen, wie kann ich die Menüfarbe (Hintergrund derzeit Blau) oben Links ändern?
                          Die Schriftfarbe bei den Navigationsleisten Überschrift ist Schwarz, kann ich die auch ändern? Ich glaube die ist mit den Trennlinien verbunden.

                          Screenshot (192).png

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

                          @sigi234
                          Noch gar nicht 😉 Habs grad hinzugefügt, lad dir das aktuelle git rep.
                          Weiter hab ich noch zwei neue Layouts für die AppBar hinzugfeügt

                          short:
                          short_modal.png

                          short_dismissable.png

                          dense (schmale AppBar):
                          dense.png

                          @heinzie

                          [{"tpl":"tplVis-materialdesign-Drawer","data":{"oid":"javascript.0.iFrame","g_fixed":false,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"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","count":"4","titleTopAppBar":"Material Design Widgets","drawerLayout":"modal","showHeader":"true","headerLabel":"<h4 class='mdc-drawer__title'>Material Design Widgets</h4><h6 class='mdc-drawer__subtitle'>by Scrounger</h6>","showLabels":"true","iconDrawer0":"/vis/widgets/materialdesign/img/IoBroker_Logo.png","iconDrawer1":"/icons-material-svg/hardware/ic_computer_48px.svg","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,"contains_view_0":"Preview","contains_view_1":"Buttons","iconDrawer2":"/vis/widgets/materialdesign/img/IoBroker_Logo.png","contains_view_2":"Cards","iconDrawer3":"/icons-material-svg/action/ic_android_48px.svg","contains_view_3":"Progress","iconDrawer4":"/vis/widgets/materialdesign/img/IoBroker_Logo.png","contains_view_4":"Slider","headers0":"","dividers0":false,"dividers1":true,"headers1":"","headers2":"Header","dividers4":true,"dividers3":true,"persistent":true,"drawerWidth":"","drawerIconHeight":"","topAppBarLayout":"standard","colorTopAppBarBackground":"","colorTopAppBarTitle":"","labels2":""},"style":{"left":"0px","top":"-1px","width":"1200px","height":"1200px","z-index":""},"widgetSet":"materialdesign"}]
                          

                          @sigi234
                          Der Volumen Regler sieht nice aus. Welches Widget ist das? Mach mal bitte ein Export.

                          <a href="https://github.com/Scrounger/ioBroker.linkeddevices">LinkedDevices Adapter</a>

                          <a href="https://github.com/Scrounger/ioBroker.vis-materialdesign">Material Design Widgets</a>

                          sigi234S 1 Reply Last reply
                          2
                          • ScroungerS Scrounger

                            @sigi234
                            Noch gar nicht 😉 Habs grad hinzugefügt, lad dir das aktuelle git rep.
                            Weiter hab ich noch zwei neue Layouts für die AppBar hinzugfeügt

                            short:
                            short_modal.png

                            short_dismissable.png

                            dense (schmale AppBar):
                            dense.png

                            @heinzie

                            [{"tpl":"tplVis-materialdesign-Drawer","data":{"oid":"javascript.0.iFrame","g_fixed":false,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"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","count":"4","titleTopAppBar":"Material Design Widgets","drawerLayout":"modal","showHeader":"true","headerLabel":"<h4 class='mdc-drawer__title'>Material Design Widgets</h4><h6 class='mdc-drawer__subtitle'>by Scrounger</h6>","showLabels":"true","iconDrawer0":"/vis/widgets/materialdesign/img/IoBroker_Logo.png","iconDrawer1":"/icons-material-svg/hardware/ic_computer_48px.svg","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,"contains_view_0":"Preview","contains_view_1":"Buttons","iconDrawer2":"/vis/widgets/materialdesign/img/IoBroker_Logo.png","contains_view_2":"Cards","iconDrawer3":"/icons-material-svg/action/ic_android_48px.svg","contains_view_3":"Progress","iconDrawer4":"/vis/widgets/materialdesign/img/IoBroker_Logo.png","contains_view_4":"Slider","headers0":"","dividers0":false,"dividers1":true,"headers1":"","headers2":"Header","dividers4":true,"dividers3":true,"persistent":true,"drawerWidth":"","drawerIconHeight":"","topAppBarLayout":"standard","colorTopAppBarBackground":"","colorTopAppBarTitle":"","labels2":""},"style":{"left":"0px","top":"-1px","width":"1200px","height":"1200px","z-index":""},"widgetSet":"materialdesign"}]
                            

                            @sigi234
                            Der Volumen Regler sieht nice aus. Welches Widget ist das? Mach mal bitte ein Export.

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

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

                            Der Volumen Regler sieht nice aus. Welches Widget ist das? Mach mal bitte ein Export.

                            ioBroker.vis-hqWidgets

                            Export Widget

                            [{"tpl":"tplHqCircle","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":true,"g_css_background":false,"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","oid":"alexa2.0.Echo-Devices.GXXXXXXXXXXXXX.Player.volume","min":"0","max":"100","digits":"0","step":"1","is_comma":false,"displayPrevious":true,"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,"descriptionLeft":"Volume to use for speak commands","thickness":"0.1","color":"#a8d7ff","bgcolor":"#dedede","caption":"Volume","hideNumber":false,"cursor":"","linecap":true,"anticlockwise":false,"unit":" %","class":""},"style":{"left":"900px","top":"251px","width":"102px","height":"108px","z-index":"5","font-size":"small","color":"#d7cec1","text-align":"left","font-family":"RobotoCondensed-Light"},"widgetSet":"hqwidgets"}]
                            

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

                            NegaleinN 1 Reply Last reply
                            0
                            • sigi234S sigi234

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

                              Der Volumen Regler sieht nice aus. Welches Widget ist das? Mach mal bitte ein Export.

                              ioBroker.vis-hqWidgets

                              Export Widget

                              [{"tpl":"tplHqCircle","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":true,"g_css_background":false,"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","oid":"alexa2.0.Echo-Devices.GXXXXXXXXXXXXX.Player.volume","min":"0","max":"100","digits":"0","step":"1","is_comma":false,"displayPrevious":true,"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,"descriptionLeft":"Volume to use for speak commands","thickness":"0.1","color":"#a8d7ff","bgcolor":"#dedede","caption":"Volume","hideNumber":false,"cursor":"","linecap":true,"anticlockwise":false,"unit":" %","class":""},"style":{"left":"900px","top":"251px","width":"102px","height":"108px","z-index":"5","font-size":"small","color":"#d7cec1","text-align":"left","font-family":"RobotoCondensed-Light"},"widgetSet":"hqwidgets"}]
                              
                              NegaleinN Offline
                              NegaleinN Offline
                              Negalein
                              Global Moderator
                              wrote on last edited by
                              #34

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

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

                              Der Volumen Regler sieht nice aus. Welches Widget ist das? Mach mal bitte ein Export.

                              ioBroker.vis-hqWidgets

                              Danke
                              Habs gleich eingebaut! 😁

                              vis (2).png

                              ° Node.js: 20.17.0 NPM: 10.8.2
                              ° Proxmox, Ubuntu 22.04.3 LTS
                              ° Fixer ---> iob fix

                              1 Reply Last reply
                              0
                              • sigi234S Online
                                sigi234S Online
                                sigi234
                                Forum Testing Most Active
                                wrote on last edited by sigi234
                                #35

                                Das gibt es jetzt viele Möglichkeiten. Ich bin begeistert.

                                Screenshot (196).png

                                Interessant wäre noch so eine Art Submenü.
                                Also: Echo Show 5 = Hauptkategorie - klick auf diese und es öffnet sich die Unterkategorie
                                - Main
                                - Daten
                                - History
                                - Provider

                                Ich habe so an die 60 Views, wenn ich die Alle ins Menü gebe wird es sehr lange.
                                Ich teste das mal.😀

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

                                ScroungerS sigi234S 2 Replies Last reply
                                1
                                • NegaleinN Offline
                                  NegaleinN Offline
                                  Negalein
                                  Global Moderator
                                  wrote on last edited by
                                  #36

                                  just my 2 Cents!!

                                  Eigentlich ein netter Adapter!
                                  Aber ich bin ehrlich, mich stört das "Donate" und "by Scrounger" doch sehr!

                                  Wenn ein Entwickler auf seiner Plattform (Website, Github, ...) um Spenden bittet, dann mach ich das sehr sehr gerne.
                                  Aber so im Design verankert, geht gar nicht.

                                  ° Node.js: 20.17.0 NPM: 10.8.2
                                  ° Proxmox, Ubuntu 22.04.3 LTS
                                  ° Fixer ---> iob fix

                                  sigi234S 1 Reply Last reply
                                  0
                                  • sigi234S sigi234

                                    Das gibt es jetzt viele Möglichkeiten. Ich bin begeistert.

                                    Screenshot (196).png

                                    Interessant wäre noch so eine Art Submenü.
                                    Also: Echo Show 5 = Hauptkategorie - klick auf diese und es öffnet sich die Unterkategorie
                                    - Main
                                    - Daten
                                    - History
                                    - Provider

                                    Ich habe so an die 60 Views, wenn ich die Alle ins Menü gebe wird es sehr lange.
                                    Ich teste das mal.😀

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

                                    @sigi234
                                    Sehr schön, wie hast du denn den Farbverlauf hinbekommen? Sind das slider aus meinem Adapter?

                                    Hab noch nen bissle weiter gebastelt. Gibt jetzt noch ein Layout backdrop 🙂

                                    backdrop_layout.gif

                                    wer testen will, master von git ziehen.

                                    <a href="https://github.com/Scrounger/ioBroker.linkeddevices">LinkedDevices Adapter</a>

                                    <a href="https://github.com/Scrounger/ioBroker.vis-materialdesign">Material Design Widgets</a>

                                    sigi234S 2 Replies Last reply
                                    0
                                    • NegaleinN Negalein

                                      just my 2 Cents!!

                                      Eigentlich ein netter Adapter!
                                      Aber ich bin ehrlich, mich stört das "Donate" und "by Scrounger" doch sehr!

                                      Wenn ein Entwickler auf seiner Plattform (Website, Github, ...) um Spenden bittet, dann mach ich das sehr sehr gerne.
                                      Aber so im Design verankert, geht gar nicht.

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

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

                                      Aber ich bin ehrlich, mich stört das "Donate" und "by Scrounger" doch sehr!

                                      Das kann man ausblenden

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

                                      NegaleinN 1 Reply Last reply
                                      0
                                      • sigi234S sigi234

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

                                        Aber ich bin ehrlich, mich stört das "Donate" und "by Scrounger" doch sehr!

                                        Das kann man ausblenden

                                        NegaleinN Offline
                                        NegaleinN Offline
                                        Negalein
                                        Global Moderator
                                        wrote on last edited by Negalein
                                        #39

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

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

                                        Aber ich bin ehrlich, mich stört das "Donate" und "by Scrounger" doch sehr!

                                        Das kann man ausblenden

                                        Die Kopfzeile als "Ganzes" geht zum ausblenden. Nur für das "by Scrounger" hab ich nichts gefunden!
                                        Und das "Donate" geht auch nicht zum ausblenden.
                                        Leider

                                        ° Node.js: 20.17.0 NPM: 10.8.2
                                        ° Proxmox, Ubuntu 22.04.3 LTS
                                        ° Fixer ---> iob fix

                                        ScroungerS sigi234S 2 Replies Last reply
                                        0
                                        • ScroungerS Scrounger

                                          @sigi234
                                          Sehr schön, wie hast du denn den Farbverlauf hinbekommen? Sind das slider aus meinem Adapter?

                                          Hab noch nen bissle weiter gebastelt. Gibt jetzt noch ein Layout backdrop 🙂

                                          backdrop_layout.gif

                                          wer testen will, master von git ziehen.

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

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

                                          Sehr schön, wie hast du denn den Farbverlauf hinbekommen? Sind das slider aus meinem Adapter?

                                          Nein, Uhula Material Design

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

                                          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

                                          157

                                          Online

                                          32.4k

                                          Users

                                          81.3k

                                          Topics

                                          1.3m

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

                                          • Don't have an account? Register

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