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. Visualisierung
  4. Material Design Widgets: Top App Bar Widget

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

Material Design Widgets: Top App Bar Widget

Scheduled Pinned Locked Moved Visualisierung
vis
412 Posts 74 Posters 95.8k Views 79 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.
  • GlasfaserG Glasfaser

    @negalein sagte in Material Design Widgets: Top App Bar Widget:

    .... der runde Button zu sehen .... Jetzt ... ist es eckig

    Dito ... ;)
    Du kannst es mit den Standarteinstellung beinflussen .

    .
    1.JPG
    .
    Jede Ecke einzeln mit der Abrundung bestimmt :

    5.JPG
    .
    oder :

    2.JPG

    3.JPG

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

    @glasfaser sagte in Material Design Widgets: Top App Bar Widget:

    Du kannst es mit den Standarteinstellung beinflussen .

    leider nichts gebracht

    Edit vis.png Unbenannt-1.png

    ° Node.js & System Update ---> sudo apt update, iob stop, sudo apt full-upgrade
    ° Node.js Fixer ---> iob nodejs-update
    ° Fixer ---> iob fix

    GlasfaserG 1 Reply Last reply
    0
    • NegaleinN Negalein

      @glasfaser sagte in Material Design Widgets: Top App Bar Widget:

      Du kannst es mit den Standarteinstellung beinflussen .

      leider nichts gebracht

      Edit vis.png Unbenannt-1.png

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

      @negalein

      Du hast es aber im Widget TopAppBar geändert !?

      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 ..

      NegaleinN 1 Reply Last reply
      0
      • GlasfaserG Glasfaser

        @negalein

        Du hast es aber im Widget TopAppBar geändert !?

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

        @glasfaser sagte in Material Design Widgets: Top App Bar Widget:

        Du hast es aber im Widget TopAppBar geändert !?

        Jep :)

        Edit vis (1).png

        ° Node.js & System Update ---> sudo apt update, iob stop, sudo apt full-upgrade
        ° Node.js Fixer ---> iob nodejs-update
        ° Fixer ---> iob fix

        GlasfaserG 1 Reply Last reply
        0
        • NegaleinN Negalein

          @glasfaser sagte in Material Design Widgets: Top App Bar Widget:

          Du hast es aber im Widget TopAppBar geändert !?

          Jep :)

          Edit vis (1).png

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

          @negalein

          Komisch ...

          Nimm mal das Widget in einem anderen Projekt , ist es auch dort so das man es nicht verändern kann , bzw. nimm mal Testweise alle CSS Anweisungen raus . Global / Projekt

          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 ..

          NegaleinN 1 Reply Last reply
          0
          • GlasfaserG Glasfaser

            @negalein

            Komisch ...

            Nimm mal das Widget in einem anderen Projekt , ist es auch dort so das man es nicht verändern kann , bzw. nimm mal Testweise alle CSS Anweisungen raus . Global / Projekt

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

            @glasfaser sagte in Material Design Widgets: Top App Bar Widget:

            Nimm mal das Widget in einem anderen Projekt , ist es auch dort so das man es nicht verändern kann , bzw. nimm mal Testweise alle CSS Anweisungen raus . Global / Projekt

            auch keine Änderung

            Ich verstehs nicht

            ° Node.js & System Update ---> sudo apt update, iob stop, sudo apt full-upgrade
            ° Node.js Fixer ---> iob nodejs-update
            ° Fixer ---> iob fix

            GlasfaserG 1 Reply Last reply
            0
            • NegaleinN Negalein

              @glasfaser sagte in Material Design Widgets: Top App Bar Widget:

              Nimm mal das Widget in einem anderen Projekt , ist es auch dort so das man es nicht verändern kann , bzw. nimm mal Testweise alle CSS Anweisungen raus . Global / Projekt

              auch keine Änderung

              Ich verstehs nicht

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

              @negalein

              Im Admin ... Adapter ... Upload durchführen bei
              Material Design und VIS

              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 ..

              NegaleinN 1 Reply Last reply
              0
              • GlasfaserG Glasfaser

                @negalein

                Im Admin ... Adapter ... Upload durchführen bei
                Material Design und VIS

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

                @glasfaser sagte in Material Design Widgets: Top App Bar Widget:

                m Admin ... Adapter ... Upload durchführen bei
                Material Design und VIS

                Nichts

                Hab auch gerade den Vis-Adapter aktualisiert, Upload VIS, Upload Material (wie immer) brachte keine Änderung.

                ° Node.js & System Update ---> sudo apt update, iob stop, sudo apt full-upgrade
                ° Node.js Fixer ---> iob nodejs-update
                ° Fixer ---> iob fix

                GlasfaserG 1 Reply Last reply
                0
                • NegaleinN Negalein

                  @glasfaser sagte in Material Design Widgets: Top App Bar Widget:

                  m Admin ... Adapter ... Upload durchführen bei
                  Material Design und VIS

                  Nichts

                  Hab auch gerade den Vis-Adapter aktualisiert, Upload VIS, Upload Material (wie immer) brachte keine Änderung.

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

                  @negalein

                  schicke mir mal dein Widget zu

                  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 ..

                  NegaleinN 1 Reply Last reply
                  0
                  • GlasfaserG Glasfaser

                    @negalein

                    schicke mir mal dein Widget zu

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

                    @glasfaser sagte in Material Design Widgets: Top App Bar Widget:

                    schicke mir mal dein Widget zu

                    du hast Post

                    ° Node.js & System Update ---> sudo apt update, iob stop, sudo apt full-upgrade
                    ° Node.js Fixer ---> iob nodejs-update
                    ° Fixer ---> iob fix

                    GlasfaserG 1 Reply Last reply
                    0
                    • NegaleinN Negalein

                      @glasfaser sagte in Material Design Widgets: Top App Bar Widget:

                      schicke mir mal dein Widget zu

                      du hast Post

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

                      @negalein

                      Stelle um auf :

                      1.JPG

                      danach werden die Werte im CSS Ränder übernommen

                      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 ..

                      NegaleinN 1 Reply Last reply
                      1
                      • GlasfaserG Glasfaser

                        @negalein

                        Stelle um auf :

                        1.JPG

                        danach werden die Werte im CSS Ränder übernommen

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

                        @glasfaser sagte in Material Design Widgets: Top App Bar Widget:

                        Stelle um auf :

                        Merci, das wars.
                        Hatte ich nicht mehr im Blick.

                        ° Node.js & System Update ---> sudo apt update, iob stop, sudo apt full-upgrade
                        ° Node.js Fixer ---> iob nodejs-update
                        ° Fixer ---> iob fix

                        1 Reply Last reply
                        0
                        • dQeLseD Online
                          dQeLseD Online
                          dQeLse
                          wrote on last edited by
                          #307

                          hat jemand von Euch die 0.5.5 mit dem ipad4 ans laufen bekommen?
                          Die TopAppBar wird mir nicht mehr angezeigt über die iobrokerApp, auf dem Rechner funktioniert Sie allerdings ohne Probleme.

                          ScroungerS 1 Reply Last reply
                          0
                          • dQeLseD dQeLse

                            hat jemand von Euch die 0.5.5 mit dem ipad4 ans laufen bekommen?
                            Die TopAppBar wird mir nicht mehr angezeigt über die iobrokerApp, auf dem Rechner funktioniert Sie allerdings ohne Probleme.

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

                            @dqelse sagte in Material Design Widgets: Top App Bar Widget:

                            hat jemand von Euch die 0.5.5 mit dem ipad4 ans laufen bekommen?
                            ...nicht mehr angezeigt über die iobrokerApp ...

                            siehe https://github.com/Scrounger/ioBroker.vis-materialdesign#iobroker-vis-app, muss erst seitens app implementiert werden.

                            dQeLseD 1 Reply Last reply
                            0
                            • ScroungerS Scrounger

                              @dqelse sagte in Material Design Widgets: Top App Bar Widget:

                              hat jemand von Euch die 0.5.5 mit dem ipad4 ans laufen bekommen?
                              ...nicht mehr angezeigt über die iobrokerApp ...

                              siehe https://github.com/Scrounger/ioBroker.vis-materialdesign#iobroker-vis-app, muss erst seitens app implementiert werden.

                              dQeLseD Online
                              dQeLseD Online
                              dQeLse
                              wrote on last edited by
                              #309

                              @scrounger vielen dank :) dann warte ich mal ab

                              1 Reply Last reply
                              0
                              • ice987I Offline
                                ice987I Offline
                                ice987
                                wrote on last edited by ice987
                                #310

                                ich möchte die Farbe des "Hamburgers" (drei weisse, horizontale Linien" 6f6dca11-6932-4ba6-8995-720e15ff0ad3-image.png ändern. Habe ich die entsprechende Option in den Einstellungen übersehen oder geht dies nur mittels dem CSS Befehl

                                .mdc-top-app-bar .mdc-top-app-bar__navigation-icon {
                                    color: #ff0000;
                                }
                                

                                Adapter: ioBroker.vis-materialdesign v0.5.6
                                Widget: materialdesign Widget - Top App Bar

                                https://github.com/Scrounger/ioBroker.vis-materialdesign/issues/171

                                husqvarna-automower, meteoblue, wiserbyfeller, spritmonitor

                                GlasfaserG 1 Reply Last reply
                                0
                                • ice987I ice987

                                  ich möchte die Farbe des "Hamburgers" (drei weisse, horizontale Linien" 6f6dca11-6932-4ba6-8995-720e15ff0ad3-image.png ändern. Habe ich die entsprechende Option in den Einstellungen übersehen oder geht dies nur mittels dem CSS Befehl

                                  .mdc-top-app-bar .mdc-top-app-bar__navigation-icon {
                                      color: #ff0000;
                                  }
                                  

                                  Adapter: ioBroker.vis-materialdesign v0.5.6
                                  Widget: materialdesign Widget - Top App Bar

                                  https://github.com/Scrounger/ioBroker.vis-materialdesign/issues/171

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

                                  @ice987

                                  Nur per CSS

                                  1.JPG

                                  du mußt noch ein !important hinter setzen , damit er auch im Runtime sichtbar ist .

                                  .mdc-top-app-bar .mdc-top-app-bar__navigation-icon {
                                  color:  #2E9AFE !important;
                                  }
                                  

                                  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
                                  1
                                  • K Kuddel

                                    Hallo zusammen,

                                    ich habe gestern angefangen das Design meiner VIS Link Text ein bisschen zu verbessern.

                                    Als ersten Schritt woltte ich mir ein neues Menü bauen. Dazu habe ich das Widget "Top Add Bar Navigation Drawer" ausgewählt:

                                    a34f8d36-8573-4a42-b7ed-48371a66a161-grafik.png

                                    Jetzt stellt sich mir die Frage, ob sich die Menüpunkte (in meinem Beispiel "System") irgenwie wieder automatisch schließen lassen.
                                    Aktuell werden die Unterpunkte nach dem Aufblättern immer angezeogt und müssen per erneutem klick wiede rzugeblättert werden.

                                    Des Weiteren frage ich mich, wie man jetzt die einezelnen Seiten über den FullyBrowser ansteuern kann, da ja alle Seiten per View in Widget 8 angezeigt werden sich bei mir dann der Seitenlink nicht ändert.

                                    Im Moment übergebe ich bei Ereignis XY immer die Adresse der jeweiligen Seiten an mein Tablet per FullyKioskBrowser.

                                    M Offline
                                    M Offline
                                    MaikelR2000
                                    wrote on last edited by
                                    #312

                                    @kuddel
                                    Wieso kann ich in der Top App den Punkt Untermenü nicht sehen? So kann es mir nichts bringen oder?
                                    menü-top-app.PNG

                                    Bin dankbar für jede Hilfe!

                                    GlasfaserG 1 Reply Last reply
                                    0
                                    • M MaikelR2000

                                      @kuddel
                                      Wieso kann ich in der Top App den Punkt Untermenü nicht sehen? So kann es mir nichts bringen oder?
                                      menü-top-app.PNG

                                      Bin dankbar für jede Hilfe!

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

                                      @maikelr2000 sagte in Material Design Widgets: Top App Bar Widget:

                                      @kuddel
                                      Wieso kann ich in der Top App den Punkt Untermenü nicht sehen?

                                      Du mußt es auf die neue Struktur ändern .

                                      So kann es mir nichts bringen oder?

                                      Schau mal in seinem Thread ... da haben wir es mehrmals geschrieben !!

                                      https://forum.iobroker.net/topic/30497/vorstellung-meine-dritte-vis/465

                                      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 ..

                                      M 1 Reply Last reply
                                      0
                                      • GlasfaserG Glasfaser

                                        @maikelr2000 sagte in Material Design Widgets: Top App Bar Widget:

                                        @kuddel
                                        Wieso kann ich in der Top App den Punkt Untermenü nicht sehen?

                                        Du mußt es auf die neue Struktur ändern .

                                        So kann es mir nichts bringen oder?

                                        Schau mal in seinem Thread ... da haben wir es mehrmals geschrieben !!

                                        https://forum.iobroker.net/topic/30497/vorstellung-meine-dritte-vis/465

                                        M Offline
                                        M Offline
                                        MaikelR2000
                                        wrote on last edited by
                                        #314

                                        @glasfaser Ja super hab mir schon nen Wolf gesucht! Danke.

                                        Wie setze ich jetzt noch meine eigene Icons ein?

                                        GlasfaserG ScroungerS 2 Replies Last reply
                                        0
                                        • M MaikelR2000

                                          @glasfaser Ja super hab mir schon nen Wolf gesucht! Danke.

                                          Wie setze ich jetzt noch meine eigene Icons ein?

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

                                          @maikelr2000 sagte in Material Design Widgets: Top App Bar Widget:

                                          Wie setze ich jetzt noch meine eigene Icons ein?

                                          Für Submenu :
                                          in icon dein Pfad reinsetzen

                                          {
                                          		"text": "PV SolarForecast Ost / West",
                                          		"icon": "/icons-mfd-png/fts_shutter_automatic.png",
                                          		"divider": "true",
                                          		"userGroups": ["administrator", "user"],
                                          		"behaviorNotInUserGroup": "disabled"
                                          	},
                                          

                                          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
                                          Reply
                                          • Reply as topic
                                          Log in to reply
                                          • Oldest to Newest
                                          • Newest to Oldest
                                          • Most Votes


                                          Support us

                                          ioBroker
                                          Community Adapters
                                          Donate

                                          569

                                          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