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

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

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

  • Weihnachtsangebot 2025! 🎄
    BluefoxB
    Bluefox
    25
    1
    2.2k

Material Design Widgets: Top App Bar Widget

Scheduled Pinned Locked Moved Visualisierung
vis
412 Posts 74 Posters 94.2k 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

    @Coffeelover

    Hast du CSS Anweisungen in Projekte/Global , nimm die mal testweise alle raus .

    C Offline
    C Offline
    Coffeelover
    wrote on last edited by
    #149

    @Glasfaser Danke. Das werde ich gelegentlich mal machen. Aktuell hat wie oben editiert das Update der VIS und/oder das Deinstallieren des Material Advanced Adapters gereicht. Letzterer war ohnehin zum testen installiert.

    GlasfaserG 1 Reply Last reply
    0
    • C Coffeelover

      @Glasfaser Danke. Das werde ich gelegentlich mal machen. Aktuell hat wie oben editiert das Update der VIS und/oder das Deinstallieren des Material Advanced Adapters gereicht. Letzterer war ohnehin zum testen installiert.

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

      @Coffeelover

      Wenn nicht dann den Adapter Material Design Widgets über git neu installieren.

      dann

      iobroker vis stop
      iobroker vis upload
      iobroker vis start
      

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

      ScroungerS 1 Reply Last reply
      0
      • GlasfaserG Glasfaser

        @Coffeelover

        Wenn nicht dann den Adapter Material Design Widgets über git neu installieren.

        dann

        iobroker vis stop
        iobroker vis upload
        iobroker vis start
        
        ScroungerS Offline
        ScroungerS Offline
        Scrounger
        Developer
        wrote on last edited by
        #151

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

        das Deinstallieren des Material Advanced Adapters gereicht.

        Das ist es, da gibts leider paar Kompatibilitätsprobleme mit dem MDW.

        @Glasfaser
        Ja die github Version beinhaltet vieles bug fixes um Kompatibilitätsprobleme mit anderen Adaptern zu vermeiden.
        Aber Achtung da das ein recht großer eingriff ist, stell ich aktuell immer noch Fehler in der Darstellung fest!

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

          Ich habe mich mit dem sensationellen "TopApp Bar Navigation Drawer"-Widget befasst und muss nun sagen: TOP ARBEIT von @Scrounger!

          Eine Kleinigkeit geht bei mir bis jetzt noch nicht ganz auf: ich setze das "Top App Bar Navigation Drawer"-Widget ein und lasse mir über einen Datenpunkt einen Wert setzen. Diesen Wert hole ich über das "basic - view in widget 8" und lasse mir, je nach Wert, eine View anzeigen. Soweit alles Gut.
          Nun gebe ich dem "basic - view in widget 8" eine fixe Höhe vor (Grösse des iPhone-Displays). Meine Views haben jedoch nicht alle die gleiche Höhe. Sofern die anzuzeigende View-Höhe kleiner ist als die voreingestellte "basic - view in widget 8"-Höhe, spielt dies keine Rolle. Wenn die anzuzeigende View-Höhe jedoch grösser ist, kann ich entweder nicht die ganze View scrollen (wenn die View grösser als die Widget-Höhe ist) oder scrolle nur weisse Fläche (wenn die View kleiner als die Widget-Höhe ist)).
          Gibt es eine elegante Lösung, dies zu umgehen? Kann z.B. die Auflösung einer View in einem Datenpunkt gespeichert werden, welche dann als Wert im "basic - view in widget 8" dynamisch im Punkt "CSS Allgemein -> height" übernommen werden kann?

          Edit:
          Folgende Lösungsmöglichkeiten habe ich gefunden:

          • Anstatt das "basic - view in widget 8“ das "iframe 8"-widget nehmen. Da kann gescrollt werden. Nachteil ist, dass das Laden des iframes etwas dauert
          • Vis-Binding im Punkt "CSS Allgemein -> height“. Je nach Datenpunkt wird die entsprechende Höhe „ausgegeben“. Nachteil: sehr unübersichtlich
          • Im "basic - view in widget 8“ unter dem Punkt "CSS Allgemein -> overflow-y“ auf „auto“ stellen. Somit löst sich das Problem elegant.

          husqvarna-automower, meteoblue, wiserbyfeller, spritmonitor

          ScroungerS 1 Reply Last reply
          0
          • ice987I ice987

            Ich habe mich mit dem sensationellen "TopApp Bar Navigation Drawer"-Widget befasst und muss nun sagen: TOP ARBEIT von @Scrounger!

            Eine Kleinigkeit geht bei mir bis jetzt noch nicht ganz auf: ich setze das "Top App Bar Navigation Drawer"-Widget ein und lasse mir über einen Datenpunkt einen Wert setzen. Diesen Wert hole ich über das "basic - view in widget 8" und lasse mir, je nach Wert, eine View anzeigen. Soweit alles Gut.
            Nun gebe ich dem "basic - view in widget 8" eine fixe Höhe vor (Grösse des iPhone-Displays). Meine Views haben jedoch nicht alle die gleiche Höhe. Sofern die anzuzeigende View-Höhe kleiner ist als die voreingestellte "basic - view in widget 8"-Höhe, spielt dies keine Rolle. Wenn die anzuzeigende View-Höhe jedoch grösser ist, kann ich entweder nicht die ganze View scrollen (wenn die View grösser als die Widget-Höhe ist) oder scrolle nur weisse Fläche (wenn die View kleiner als die Widget-Höhe ist)).
            Gibt es eine elegante Lösung, dies zu umgehen? Kann z.B. die Auflösung einer View in einem Datenpunkt gespeichert werden, welche dann als Wert im "basic - view in widget 8" dynamisch im Punkt "CSS Allgemein -> height" übernommen werden kann?

            Edit:
            Folgende Lösungsmöglichkeiten habe ich gefunden:

            • Anstatt das "basic - view in widget 8“ das "iframe 8"-widget nehmen. Da kann gescrollt werden. Nachteil ist, dass das Laden des iframes etwas dauert
            • Vis-Binding im Punkt "CSS Allgemein -> height“. Je nach Datenpunkt wird die entsprechende Höhe „ausgegeben“. Nachteil: sehr unübersichtlich
            • Im "basic - view in widget 8“ unter dem Punkt "CSS Allgemein -> overflow-y“ auf „auto“ stellen. Somit löst sich das Problem elegant.
            ScroungerS Offline
            ScroungerS Offline
            Scrounger
            Developer
            wrote on last edited by
            #153

            @ice987
            Schau dir am besten das online Beispiel an, da sieht man wie man ein responisv layout umsetzen kann -> https://github.com/Scrounger/ioBroker.vis-materialdesign#online-example-project

            Ich realisiere das so:

            • basic - view in widget 8: höhe 100% - höhe der top app bar, kein overflow
            • views: overflow-auto wenn scrollbar benötigt werden
            1 Reply Last reply
            0
            • A Offline
              A Offline
              aldoa1
              wrote on last edited by
              #154

              Die Top-App-Bar-Navigation macht bei mir Probleme.
              Öffne ich die index Seite zuckt ganz kurz der erste View (mein Startview) und dann sehe ich nur noch die Top-App-Bar und eine weisse Seite.
              Wenn ich dann im Menü die erste Seite auswähle, ist die Darstellung so wie ich es von Anfang an benötige.

              Was könnte das Problem sein?

              GlasfaserG 1 Reply Last reply
              0
              • A aldoa1

                Die Top-App-Bar-Navigation macht bei mir Probleme.
                Öffne ich die index Seite zuckt ganz kurz der erste View (mein Startview) und dann sehe ich nur noch die Top-App-Bar und eine weisse Seite.
                Wenn ich dann im Menü die erste Seite auswähle, ist die Darstellung so wie ich es von Anfang an benötige.

                Was könnte das Problem sein?

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

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

                Die Top-App-Bar-Navigation macht bei mir Probleme.

                erst seit kurzen oder fängst du damit erst an !?

                Öffne ich die index Seite zuckt ganz kurz der erste View (mein Startview)

                Was für eine Index Seite.

                Du hast im prinzip nur noch eine StartView ...
                deine anderen Views werden dann mit dem Widget ContainerView8 dargestelllt .

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

                A 1 Reply Last reply
                0
                • GlasfaserG Glasfaser

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

                  Die Top-App-Bar-Navigation macht bei mir Probleme.

                  erst seit kurzen oder fängst du damit erst an !?

                  Öffne ich die index Seite zuckt ganz kurz der erste View (mein Startview)

                  Was für eine Index Seite.

                  Du hast im prinzip nur noch eine StartView ...
                  deine anderen Views werden dann mit dem Widget ContainerView8 dargestelllt .

                  A Offline
                  A Offline
                  aldoa1
                  wrote on last edited by
                  #156

                  @Glasfaser

                  Ich habe Gestern begonnen.

                  index ist mein StartView

                  Da habe ich die Top-Navigation und die ContainerView8

                  Bei Top-Navigation habe ich eingetragen:
                  Startseite
                  Heizung

                  Bei ContainerView8
                  dann der View für die Starseite und der View für die Heizung.

                  Die Navigation funktioniert.Beim Aufruf sehe ich ganz kurz den View der Startseite und dann ist nur noch die Top-Navigation zu sehen (unten weiss).
                  Den View Startseite kann ich im Menü aufrufen. Dieser View soll aber sofort sichtbar sein.

                  GlasfaserG 1 Reply Last reply
                  0
                  • A aldoa1

                    @Glasfaser

                    Ich habe Gestern begonnen.

                    index ist mein StartView

                    Da habe ich die Top-Navigation und die ContainerView8

                    Bei Top-Navigation habe ich eingetragen:
                    Startseite
                    Heizung

                    Bei ContainerView8
                    dann der View für die Starseite und der View für die Heizung.

                    Die Navigation funktioniert.Beim Aufruf sehe ich ganz kurz den View der Startseite und dann ist nur noch die Top-Navigation zu sehen (unten weiss).
                    Den View Startseite kann ich im Menü aufrufen. Dieser View soll aber sofort sichtbar sein.

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

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

                    index ist mein StartView

                    kommt mir bekannt vor .
                    smarthome-tricks.de

                    Eigentlich sehr gut erklärt .. verstehe nur nicht was du mit "zuckt ganz kurz " meinst ..
                    Das View wird angezeigt und verschwindet sofort !?

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

                    A 1 Reply Last reply
                    0
                    • GlasfaserG Glasfaser

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

                      index ist mein StartView

                      kommt mir bekannt vor .
                      smarthome-tricks.de

                      Eigentlich sehr gut erklärt .. verstehe nur nicht was du mit "zuckt ganz kurz " meinst ..
                      Das View wird angezeigt und verschwindet sofort !?

                      A Offline
                      A Offline
                      aldoa1
                      wrote on last edited by
                      #158

                      @Glasfaser
                      Nach dieser Seite habe ich es gestern erstellt.

                      Ja, der View wird ganz kurz angezeigt und verschwindet dann sofort.

                      GlasfaserG 1 Reply Last reply
                      0
                      • A aldoa1

                        @Glasfaser
                        Nach dieser Seite habe ich es gestern erstellt.

                        Ja, der View wird ganz kurz angezeigt und verschwindet dann sofort.

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

                        @aldoa1

                        Das wechseln der View wir durch den gemeinsamen Datenpunkt gesteuert,
                        verändert der sich dann auch selbstständig bzw. zuckt .

                        Hast du nur die "index "View , auf default gestellt.

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

                        A 1 Reply Last reply
                        0
                        • GlasfaserG Glasfaser

                          @aldoa1

                          Das wechseln der View wir durch den gemeinsamen Datenpunkt gesteuert,
                          verändert der sich dann auch selbstständig bzw. zuckt .

                          Hast du nur die "index "View , auf default gestellt.

                          1.JPG

                          A Offline
                          A Offline
                          aldoa1
                          wrote on last edited by
                          #160

                          @Glasfaser
                          Der Datenpunkt ist angelegt. Normalerweise soll der 0 gestartet werden. Das ist der View mit dem Material Grid. Der 1 ist ein (noch) leerer View "Heizung".
                          Stelle ich auf die 1 und öffne die Seite wird sofort unter dem Menü der Heizung view auch angezeigt.

                          Der 0 mit dem Grid scheint Probleme zu machen. Der ist ganz kurz zu sehen und verschwindet dann. Ist aber sichtbar, wenn ich über das Menü öffne.

                          1 Reply Last reply
                          0
                          • A Offline
                            A Offline
                            aldoa1
                            wrote on last edited by
                            #161

                            Wenn ich zwei (nicht-Grid) Views einbinde, funktioniert es auch.

                            1 Reply Last reply
                            0
                            • G Offline
                              G Offline
                              gerald123
                              wrote on last edited by
                              #162

                              Ich benötge mal wieder Hilfe bei der Einrichtung der Top-Bar-Navigation.
                              Ich habe den MD Adaper installiert und hier wird die Version 0.3.30 angezeigt.
                              Ich habe jetzt mal 3 Menüpunkte eingerichtet, diese Funktionieren auch perfekt.
                              Nun wollte ich einen 4ten. Menüpunkt einrichten der zwei Untermenüpunkte hat.
                              Leider schaffe ich es nicht mit der Anleitung von GitHub.
                              Es werden zwar die Untermenüpunkte in der Vis angezeigt, wenn ich dann einen anwähle wird ein View aufgerufen den ich aber nicht angegeben habe.
                              9524cf5f-be6b-486d-acc4-1eef7af63f4c-image.png

                              Was mach ich da nur Falsch?

                              Synology 918+ 4GB; ioBroker auf RPI4; Zigbee; Sonoff

                              GlasfaserG 1 Reply Last reply
                              0
                              • G gerald123

                                Ich benötge mal wieder Hilfe bei der Einrichtung der Top-Bar-Navigation.
                                Ich habe den MD Adaper installiert und hier wird die Version 0.3.30 angezeigt.
                                Ich habe jetzt mal 3 Menüpunkte eingerichtet, diese Funktionieren auch perfekt.
                                Nun wollte ich einen 4ten. Menüpunkt einrichten der zwei Untermenüpunkte hat.
                                Leider schaffe ich es nicht mit der Anleitung von GitHub.
                                Es werden zwar die Untermenüpunkte in der Vis angezeigt, wenn ich dann einen anwähle wird ein View aufgerufen den ich aber nicht angegeben habe.
                                9524cf5f-be6b-486d-acc4-1eef7af63f4c-image.png

                                Was mach ich da nur Falsch?

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

                                @gerald123
                                Zeige mal die Einstellung vom Widget "View in Widget 8"

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

                                G 1 Reply Last reply
                                0
                                • GlasfaserG Glasfaser

                                  @gerald123
                                  Zeige mal die Einstellung vom Widget "View in Widget 8"

                                  G Offline
                                  G Offline
                                  gerald123
                                  wrote on last edited by
                                  #164

                                  @Glasfaser Das habe ich mal Testweise so angelegt:

                                  a48fb3da-8cd8-4e9b-a91c-2a143aec2753-image.png

                                  Synology 918+ 4GB; ioBroker auf RPI4; Zigbee; Sonoff

                                  GlasfaserG 2 Replies Last reply
                                  0
                                  • G gerald123

                                    @Glasfaser Das habe ich mal Testweise so angelegt:

                                    a48fb3da-8cd8-4e9b-a91c-2a143aec2753-image.png

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

                                    @gerald123

                                    der zwei Untermenüpunkte hat.

                                    Heizung und System sind dann in 4 ?

                                    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
                                    • G gerald123

                                      @Glasfaser Das habe ich mal Testweise so angelegt:

                                      a48fb3da-8cd8-4e9b-a91c-2a143aec2753-image.png

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

                                      @gerald123

                                      hier fehlt auch der gemeinsame Datenpunkt zum Umschalten .

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

                                      G 1 Reply Last reply
                                      0
                                      • GlasfaserG Glasfaser

                                        @gerald123

                                        hier fehlt auch der gemeinsame Datenpunkt zum Umschalten .

                                        1.JPG

                                        G Offline
                                        G Offline
                                        gerald123
                                        wrote on last edited by
                                        #167

                                        @Glasfaser Muss ich hier einen Datenpunkt manuell anlegen (String)?
                                        Ja, Heizung und System sollen die Untermenüpunkte im Menüpunkt 4 sein.

                                        Synology 918+ 4GB; ioBroker auf RPI4; Zigbee; Sonoff

                                        GlasfaserG NegaleinN 2 Replies Last reply
                                        0
                                        • G gerald123

                                          @Glasfaser Muss ich hier einen Datenpunkt manuell anlegen (String)?
                                          Ja, Heizung und System sollen die Untermenüpunkte im Menüpunkt 4 sein.

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

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

                                          ich habe jetzt mal 3 Menüpunkte eingerichtet, diese Funktionieren auch perfekt.
                                          Nun wollte ich einen 4ten. Menüpunkt einrichten der zwei Untermenüpunkte hat.

                                          Dann passt das aber nicht , 1 bis 3 wären dann einzelne Views

                                          Ja, Heizung und System sollen die Untermenüpunkte im Menüpunkt 4 sein.

                                          ein frei lassen ....

                                          siehe hier bei mir das Untermenue beginnt ab 7 ( TIMER ) oder 11 ( IT )

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

                                          G 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

                                          870

                                          Online

                                          32.6k

                                          Users

                                          82.2k

                                          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