Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Visualisierung
    4. Material Design Widgets: Top App Bar Widget

    NEWS

    • Neuer Blog: Fotos und Eindrücke aus Solingen

    • ioBroker@Smart Living Forum Solingen, 14.06. - Agenda added

    • ioBroker goes Matter ... Matter Adapter in Stable

    Material Design Widgets: Top App Bar Widget

    This topic has been deleted. Only users with topic management privileges can see it.
    • Dicken
      Dicken @Chris Tailor last edited by

      @chris-tailor said in Material Design Widgets: Top App Bar Widget:

      Das letzte "Problem", was ich mit der Top App Bar habe ist die Höhe der Menüpunkte. Kann man diese unabhängig von der Grösse des Symbols definieren? Mit den Chrome Entwickler Tools konnte ich die Höhe ohne Probleme manipulieren:
      3eaddab7-99d8-4163-bf06-9cf16114cb8a-image.png

      <div class="mdc-list-item mdc-ripple-upgraded" tabindex="-1" id="listItem_3" style="height: 120px !important;" data-value=""><span class="mdi mdi-train materialdesign-icon-image mdc-list-item__graphic" style="width: 20px !important;; height: 20px !important;; font-size: 20px !important;; color: #ffffff; padding-top: 8px; padding-bottom: 8px;;"></span><span class="mdc-list-item__text mdc-typography--headline5" id="listItem_3" style="width: 100%; text-align: left; ">
                                              SBB
                                      </span></div>
      

      Global über einen CSS Eintrag habe ich das nicht hinbekommen, bzw. die Höhe ändert sich nicht:

      .mdc-list-item .mdc-ripple-upgraded { 
          height: 120px !important;
      }
      

      Jemand eine Idee?

      Hey, ich weiß das der Beitrag hier schon uralt ist, aber hab in dem Thread hier keine Antwort dazu gefunden.
      Habe das selbe Problem und würde die Höhe auch gern ändern, hat da jemand ne Möglichkeit für mich?

      1 Reply Last reply Reply Quote 0
      • I
        it00x32 last edited by

        Höhe von Top Titel

        ich steh etwas auf der Leitung. Wie kann ich das Fenster des Kopfzeilentext kleiner machen (schwarze Box wo Titel und Subtitel drinnen steht, Nav ist Permanent)?

        Der CSS Eintrag .mdc-top-app-bar__row giltet ja nur für die Leiste neben dem Menü

        Bildschirmfoto 2022-04-11 um 10.52.04.png

        Danke

        1 Reply Last reply Reply Quote 0
        • Martin Blank
          Martin Blank last edited by

          Guten Abend zusammen.

          ist es in der neuen Version irgendwie möglich ein 2 Faches Untermenü zu machen?
          Bsp.:

          • EG
            • Küche
            • Wohnzimmer
              - Licht
              - Rolladen
              - usw.
            • Büro

          Wäre dankbar für Tipps.

          1 Reply Last reply Reply Quote 0
          • P
            prorun last edited by

            Hallo Zusammen,

            ich würde gerne meine Top App Bar auf eine Höhe von 30px verkleinern. Also ungefähr halb so groß wie die dense-Variante die man über das Layout einstellen kann.

            Bei einer höhe von nur 30px müsste jedoch auch der Menu-button (Navigation icon) entsprechend kleiner werden. Gibt es eine Möglichkeit das umzusetzen.

            Hintergrund: vis wird auf einem iPhone 13 Mini dargestellt und da verschlingt selbst die dense-Variante viel zu viel Platz.

            Vielen Dank schon mal vorab!

            T 1 Reply Last reply Reply Quote 0
            • T
              Trikolon @prorun last edited by

              Hallo zusammen,
              ich würde gerne die TopBar im Strandart verwenden und in dem "blauen" Bereich der TopBar, also rechts Neben dem Namen des MenuItems ein paar Infos anzeigen lassen. Leider scrollen dies mit nach oben, wenn ich scrolle:
              Soll Zustand der beiden weißen Zahlen oben rechts:
              49ae10d8-f459-4dc9-9f2c-39a64598721c-image.png

              Nach etwas Scrollen nach unten:
              163010b1-351a-4161-a4e2-974a0deb61ee-image.png

              Wie kann ich die Zahlen denn persistent in der Position machen?

              Danke und Gruß
              Ben

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

                Hier kurz mein Workaround für den Github-Issue #212 "Top Bar App: Objekt ID wird ab Element 9 wieder auf 0 gesetzt"

                Ich verwende zwei Datenpunkte:

                2023-01-22_09-25-00.jpg

                und ein Skript:

                2023-01-22_09-24-15.jpg

                Datenpunkt in Top App Bar:

                2023-01-22_09-26-15.jpg

                Datenpunkt in View in Widget8:

                2023-01-22_09-26-40.jpg

                1 Reply Last reply Reply Quote 0
                • A
                  aproxxo last edited by

                  Guten Tag,
                  ich bin noch ganz neu in ioBroker.
                  Ich würde gerne mit dem Menü anfangen. Leider wird mir das gar nicht angezeigt. Nur in der Runtime. Finde leider nicht die Lösung.
                  Und wie machen die Profis die Auflösung. Schön wäre es, wenn es sich an die Geräte anpassen würde.
                  Vielen Dank

                  b054594d-629a-44ed-825b-aec7e383a210-Bildschirmfoto 2025-04-19 um 09.22.28.png Bildschirmfoto 2025-04-19 um 09.22.28

                  O 1 Reply Last reply Reply Quote 0
                  • O
                    Oli @aproxxo last edited by

                    @aproxxo
                    Benutzt du VIS 1, oder VIS 2? In der VIS 2 funktionieren die Widgets nicht

                    A 1 Reply Last reply Reply Quote 0
                    • A
                      aproxxo @Oli last edited by

                      @oli ich benutze die Vis2.
                      Ach dann gibt es auch ein Sinn. Mir wird das Widget nur im Runtime angezeigt.

                      Welchen Möglichkeiten würdest du mir vorschlagen? Ich würde gerne ein Menü haben das sich aufklappt. Und dann zusätzlich noch ein Untermenü.

                      sigi234 1 Reply Last reply Reply Quote 0
                      • sigi234
                        sigi234 Forum Testing Most Active @aproxxo last edited by

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

                        Welchen Möglichkeiten würdest du mir vorschlagen? Ich würde gerne ein Menü haben das sich aufklappt. Und dann zusätzlich noch ein Untermenü.

                        https://github.com/ioBroker/ioBroker.vis-2/issues/253

                        foxriver76 created this issue in ioBroker/ioBroker.vis-2

                        open Vis 2.0: nested menu (or second level) #253

                        A 1 Reply Last reply Reply Quote 0
                        • A
                          aproxxo @sigi234 last edited by

                          @sigi234 oh okay vielen Dank.

                          Gibt es dann eine alternative zu diesem Widget? Wie machen das hier die Profis denn?

                          1 Reply Last reply Reply Quote 0
                          • A
                            aproxxo last edited by

                            Leider werden mir nicht mal die Basis Widgets im Editor angezeigt. Ich glaube ich habe ein ganz anderes Problem.

                            55d9cbfb-0be6-4275-b00f-8b6ff7e756e4-Bildschirmfoto 2025-04-19 um 10.45.41.png Bildschirmfoto 2025-04-19 um 10.45.41

                            sigi234 1 Reply Last reply Reply Quote 0
                            • sigi234
                              sigi234 Forum Testing Most Active @aproxxo last edited by sigi234

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

                              Leider werden mir nicht mal die Basis Widgets im Editor angezeigt. Ich glaube ich habe ein ganz anderes Problem.

                              VIS2 Version?

                              Screenshot (1156).png

                              Schon mal einen upload vis-2 gemacht?

                              1 Reply Last reply Reply Quote 0
                              • A
                                aproxxo last edited by

                                @sigi234 ich hab die Lösung.
                                Habe auf Beta umgestellt und jetzt wird alles angezeigt. Danke!

                                K 1 Reply Last reply Reply Quote 0
                                • K
                                  Kippe @aproxxo last edited by Kippe

                                  Hallo
                                  Ich habe das Problem, das ich auf meinem Tablett unter Fully die Materaldesign Bar nich nach unten scrollen kann. Auf dem Pc mit dem Chrom Brouser geht es auch nicht. Was mache ich da Falsch?

                                  IMG_0632.jpeg

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

                                  Support us

                                  ioBroker
                                  Community Adapters
                                  Donate

                                  673
                                  Online

                                  31.9k
                                  Users

                                  80.1k
                                  Topics

                                  1.3m
                                  Posts

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