Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Entwicklung
    4. [Neuer VIS-Adpater] Material Design Widgets

    NEWS

    • Monatsrückblick - April 2025

    • Minor js-controller 7.0.7 Update in latest repo

    • Save The Date: ioBroker@Smart Living Forum Solingen, 14.06.

    [Neuer VIS-Adpater] Material Design Widgets

    This topic has been deleted. Only users with topic management privileges can see it.
    • Scrounger
      Scrounger Developer @darkiop last edited by Scrounger

      @darkiop
      Keine Ahnung was du da mit nem flex-container machst. Wie oben bereits geschrieben einfach rein kopieren als Beschriftung, binding anpassen
      d.h. <div style="display:flex; flex-direction: row; justify-content: center; align-items: center"> <label style="width: 100%">Beschreibung</label> <label>{virtualpowermeter.0.Virtual_Energy_Total}Wh</label> </div>
      in
      tmp.png
      kopieren.

      Dann klappt es auch mit deiner View:
      tmp2.png

      @sigi234
      Hast du die alte Top App Bar gelöscht? Update wie oben geschrieben durchgeführt und iob neugestartet? GGf. komplett deinstallieren und nochmal neu installireren.

      D 1 Reply Last reply Reply Quote 0
      • D
        darkiop Most Active @Scrounger last edited by

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

        Keine Ahnung was du da mit nem flex-container machst. Wie oben bereits geschrieben einfach rein kopieren als Beschriftung, binding anpassen

        Habe alles nochmal neu von Github gezogen, jetzt passt - irgendwas war da vorher wohl zerschossen.

        So muss das ausschauen:

        4590f7cb-61da-40ce-b74b-ee5fc9339789-grafik.png

        Für den Typ 'html' bei der Beschreibung könnte ich dir nen PR schicken, oder möchtest es so lassen?

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

          Hallo,

          jetzt muss ich mal dumm Fragen bezüglich der Top App Bar.

          Ich habe meine Views mit einem einheitlichen Button-Menu als eigenständige View, einem Content-Bereich als eigenständige View und einem Footer, ebenfalls als View, erstellt. erstellt. Wenn ich die Top App Bar nutzen will muss ich eine View mit dem Widget erstellen und jede View dort eintragen. Oder verstehe ich da was falsch?

          Scrounger 1 Reply Last reply Reply Quote 0
          • Scrounger
            Scrounger Developer @CKMartens last edited by Scrounger

            @CKMartens
            Korrekt. Du machst dir eine View in der nur das Top App Bar Widget drin ist.
            Bei der Top App Bar trägst du dann unter 'Views' alle anderen Views ein:
            example.png

            Anhand des Index z.B. Tab[2] kannst du dann alles andere entsprechend konfigurieren, z.B. Text und Bilder der Nav Leiste:
            7e2a973c-08bc-48d0-9b89-f92fb2914c67-grafik.png

            Die oben dargestellten Einstellung der Screenshots ergeben dann folgende Nav Leiste:
            30dc670f-e0fd-44e1-b079-63dec1795f6c-grafik.png

            CKMartens 1 Reply Last reply Reply Quote 2
            • CKMartens
              CKMartens @Scrounger last edited by

              @Scrounger Danke für die Erlärung

              1 Reply Last reply Reply Quote 0
              • D
                dos1973 @gravidi last edited by

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

                @dos1973

                Magst du mir verraten welchen ICON Pack für Wetter Icons das ist? Danke!

                sorry, keine Ahnung wo ich das her hatte... ich kann es aber zippen und hochladen...

                sigi234 G 2 Replies Last reply Reply Quote 0
                • L
                  Leviathan09 last edited by

                  Täuscht es oder verbraucht der Adapter einiges an Speicherplatz auf der Platte?
                  Liegt vermutlich ja an den ganzen Grafiken....aber ob man da vllt bisschen was shrinken kann oder ?

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

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

                    Magst du mir verraten welchen ICON Pack für Wetter Icons das ist? Danke!

                    Gelöscht, Falsch

                    1 Reply Last reply Reply Quote 0
                    • Scrounger
                      Scrounger Developer @Leviathan09 last edited by Scrounger

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

                      Täuscht es oder verbraucht der Adapter einiges an Speicherplatz auf der Platte?
                      Liegt vermutlich ja an den ganzen Grafiken....aber ob man da vllt bisschen was shrinken kann oder ?

                      Was heißt den einiges in Zahlen?
                      Bei mir braucht der ca. 10Mb.

                      Und welche ganzen Grafiken meinst du?

                      Edit:
                      Jetzt bin ich auf den trichter gekommen was du mit grafiken meinst. Die werden gar net benötigt, die dependencies ist falsch, hab das entsprechend korrigiert.
                      d.h. die Ordner '/node_module/material-components-web/' und '/node_modules/material-design-icons/' können ohne Auswirkungen zu haben gelöscht werden - das spart dann mal glatt 50Mb 😉

                      L 1 Reply Last reply Reply Quote 0
                      • L
                        Leviathan09 @Scrounger last edited by Leviathan09

                        @Scrounger Die zwei Ordner schau ich mir gleich mal an.

                        Bei mir hat der Ordner "/iobroker.vis-materialdesign" um die 400MB.
                        Habe jedoch zwei Adapter zu dem Thema Material Design.
                        Bin mir jetzt gerade nicht sicher ob dieser zu deinem Adapter gehört.

                        Edit: War aber auch nicht als "geflenne" gemeint das dein Adapter zu viel Platz verbraucht, habe ja 15GB die sollten reichen.
                        Fand es nur Auffällig das der oben genannte Ordner über 400MB hat während alle anderen Ordner im Bereich von max 50MB liegen (Ausnahme Javascript und Zigbee, die haben auch um die 300MB)

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

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

                          "/iobroker.vis-materialdesign

                          Wo ist dieser genau?

                          L 1 Reply Last reply Reply Quote 0
                          • L
                            Leviathan09 @sigi234 last edited by

                            @sigi234 /node_modules/iobroker.vis-materialdesign

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

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

                              @sigi234 /node_modules/iobroker.vis-materialdesign

                              Danke, da habe ich 9 MB

                              L 1 Reply Last reply Reply Quote 0
                              • L
                                Leviathan09 @sigi234 last edited by

                                @sigi234 Ich habe den Adapter nun nochmal neu installiert.
                                Nun sind es bei mir auch nur 9MB

                                Sehr komisch....

                                1 Reply Last reply Reply Quote 0
                                • Scrounger
                                  Scrounger Developer last edited by Scrounger

                                  Nachdem ich heute weiter an meinem Produktiv VIS gearbeitet habe, ist mir aufgefallen dass einfach keine wirklich schönen Graphen gibt, die man so gestalten kann das sie dem Material Design entsprechen. Hab also mal geschaut was es so für APIs gibt.

                                  Jetzt brauch ich mal Euren Rat bzw. Meinung. Ich würde gerne die Google Chart Api, da super easy zu verwenden - auf den ersten Blick ;).
                                  Hier mal ein kleines Beispiel, läuft bei mir im VIS schon:
                                  charts.gif

                                  Allerdings kann diese API nur online genutzt werden. Wie seht ihr das, ist das ein NO GO?

                                  Alternativ gebe es noch die TOAST UI Chart API, die man auch offline nutzen kann, allerdings entspricht die halt nicht dem Material Design bzw. die Anpassung darauf wird viel aufwendiger.

                                  sigi234 Meistertr G 3 Replies Last reply Reply Quote 0
                                  • sigi234
                                    sigi234 Forum Testing Most Active @Scrounger last edited by

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

                                    Wie seht ihr das, ist das ein NO GO?

                                    Ja

                                    Scrounger 1 Reply Last reply Reply Quote 0
                                    • Scrounger
                                      Scrounger Developer @sigi234 last edited by

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

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

                                      Wie seht ihr das, ist das ein NO GO?

                                      Ja

                                      Und warum?

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

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

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

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

                                        Wie seht ihr das, ist das ein NO GO?

                                        Ja

                                        Und warum?

                                        Internet geht nicht Chart weg?

                                        Scrounger 1 Reply Last reply Reply Quote 0
                                        • Scrounger
                                          Scrounger Developer @sigi234 last edited by Scrounger

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

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

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

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

                                          Wie seht ihr das, ist das ein NO GO?

                                          Ja

                                          Und warum?

                                          Internet geht nicht Chart weg?

                                          Naja wenn das Internet nicht geht, dann gibt es bei vielen wahrscheinlich ganz andere Cloud Probleme 😉
                                          Und das könnte man umgehen, da es die API schon offline gibt, aber sie dann halt nicht mehr den terms of service entsprechen würde. Das könnte aber jeder selbst anpassen. Allerdings das direkt in einem OpenSource einzubinden geht halt nicht.

                                          Ich selber habe eher ein Problem damit, dass meine ganzen Daten dann über google laufen.

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

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

                                            Ich selber habe eher ein Problem damit, dass meine ganzen Daten dann über google laufen.

                                            Na ja, die wissen eh schon alles über mich. Wenn ich einen Lebenslauf brauche rufe ich dort an.😀

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

                                            Support us

                                            ioBroker
                                            Community Adapters
                                            Donate

                                            749
                                            Online

                                            31.6k
                                            Users

                                            79.4k
                                            Topics

                                            1.3m
                                            Posts

                                            adapter
                                            30
                                            271
                                            37482
                                            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