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: Masonry Views Widget

NEWS

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

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

  • Weihnachtsangebot 2025! 🎄
    BluefoxB
    Bluefox
    25
    1
    2.1k

Material Design Widgets: Masonry Views Widget

Scheduled Pinned Locked Moved Visualisierung
vis
53 Posts 18 Posters 7.1k Views 24 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.
  • J Offline
    J Offline
    jerzimeik
    wrote on last edited by
    #10

    Hallo,

    soll das View nicht automatisch scrollen?

    Bei mir schneidet er unten einfach alles was nicht passt, ab ?!?

    ScroungerS 1 Reply Last reply
    0
    • J jerzimeik

      Hallo,

      soll das View nicht automatisch scrollen?

      Bei mir schneidet er unten einfach alles was nicht passt, ab ?!?

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

      @jerzimeik sagte in Material Design Widgets: Masonry Views Widget:

      soll das View nicht automatisch scrollen?
      Bei mir schneidet er unten einfach alles was nicht passt, ab ?!?

      Musst overflow-y aktivieren:

      f9a07c75-8e3c-42d3-9883-ed7ed7ff0596-grafik.png

      1 Reply Last reply
      0
      • B Offline
        B Offline
        BobBruni
        wrote on last edited by BobBruni
        #12

        Seit dem Update auf Version 0.2.57 funktionieren bei mir die Sichbarkeitseinstellungen nicht mehr... Cards werden entsprechend nicht mehr ein- bzw. ausgeblendet!?
        Getestet mit Edge und Chrome.

        ###Erledigt! Mit Version 0.2.59 läuft alles!!!

        1 Reply Last reply
        0
        • B Offline
          B Offline
          brain
          wrote on last edited by brain
          #13

          @Scrounger Ich glaube nicht, dass das ein Bug ist, der zu einem speziellen Widget gehört. Deswegen poste ich hier.
          Die Anzeige der einzelnen Views wird bei mir auf dem Handy abgeschnitten:
          b31fd8a4-35c4-49ce-a4e7-e56e0523227c-grafik.png
          Hat jemand eine Idee an was das liegt und vielleicht einen Lösungsvorschlag? Ich habe das "view in widget 8" widget im Verdacht, bin mir aber nicht sicher. Scrollen durch die komplette Ansicht funktioniert bei mir nur im View zum Adapterstatus: https://forum.iobroker.net/topic/30662/material-design-widgets-skript-status

          ScroungerS 1 Reply Last reply
          0
          • B brain

            @Scrounger Ich glaube nicht, dass das ein Bug ist, der zu einem speziellen Widget gehört. Deswegen poste ich hier.
            Die Anzeige der einzelnen Views wird bei mir auf dem Handy abgeschnitten:
            b31fd8a4-35c4-49ce-a4e7-e56e0523227c-grafik.png
            Hat jemand eine Idee an was das liegt und vielleicht einen Lösungsvorschlag? Ich habe das "view in widget 8" widget im Verdacht, bin mir aber nicht sicher. Scrollen durch die komplette Ansicht funktioniert bei mir nur im View zum Adapterstatus: https://forum.iobroker.net/topic/30662/material-design-widgets-skript-status

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

            @brain
            Was ist genau das Problem, abgeschnitten oder das du nicht scollen kannst.
            Ich schätze du nutzt das Masnory Widget im view in widget 8?
            Falls ja musst du beim Masnory Widget overflow-y auf auto stellen, dann geht das scrollen. Schau dir das Online Beispiel an, das ist der Fall genau so umgesetzt.

            B 1 Reply Last reply
            1
            • ScroungerS Scrounger

              @brain
              Was ist genau das Problem, abgeschnitten oder das du nicht scollen kannst.
              Ich schätze du nutzt das Masnory Widget im view in widget 8?
              Falls ja musst du beim Masnory Widget overflow-y auf auto stellen, dann geht das scrollen. Schau dir das Online Beispiel an, das ist der Fall genau so umgesetzt.

              B Offline
              B Offline
              brain
              wrote on last edited by
              #15

              @Scrounger Vielen Dank. Genau das wars!

              1 Reply Last reply
              0
              • M Offline
                M Offline
                Mottimuc
                wrote on last edited by Mottimuc
                #16

                Hallo @Scrounger,

                vielleicht mal was für die nächste Version zum überlegen. Wenn man die Views aufgebaut hat und später einem einfällt, dass man die Sortierung anders haben möchte, muss man entweder im Code rumfriemeln oder im VIS-Edit jede Menge klicks durchführen (wenn ich richtig annehme...).

                Wäre es ggf möglich nen Index je View einzubauen, der die Position angibt? Den könnte man bequem im Nachgang anpassen?

                Viele Grüße
                Michael

                ScroungerS 2 Replies Last reply
                0
                • M Mottimuc

                  Hallo @Scrounger,

                  vielleicht mal was für die nächste Version zum überlegen. Wenn man die Views aufgebaut hat und später einem einfällt, dass man die Sortierung anders haben möchte, muss man entweder im Code rumfriemeln oder im VIS-Edit jede Menge klicks durchführen (wenn ich richtig annehme...).

                  Wäre es ggf möglich nen Index je View einzubauen, der die Position angibt? Den könnte man bequem im Nachgang anpassen?

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

                  @Mottimuc sagte in Material Design Widgets: Masonry Views Widget:

                  Hallo @Scrounger,

                  vielleicht mal was für die nächste Version zum überlegen. Wenn man die Views aufgebaut hat und später einem einfällt, dass man die Sortierung anders haben möchte, muss man entweder im Code rumfriemeln oder im VIS-Edit jede Menge klicks durchführen (wenn ich richtig annehme...).

                  Wäre es ggf möglich nen Index je View einzubauen, der die Position angibt? Den könnte man bequem im Nachgang anpassen?

                  Die Idee hatte ich auch schon und bin bereits am grübeln wie man das Umsetzen könnte.
                  Schreib doch bitte mal ein Issue auf git, damit ich es nicht vergesse.

                  1 Reply Last reply
                  0
                  • M Mottimuc

                    Hallo @Scrounger,

                    vielleicht mal was für die nächste Version zum überlegen. Wenn man die Views aufgebaut hat und später einem einfällt, dass man die Sortierung anders haben möchte, muss man entweder im Code rumfriemeln oder im VIS-Edit jede Menge klicks durchführen (wenn ich richtig annehme...).

                    Wäre es ggf möglich nen Index je View einzubauen, der die Position angibt? Den könnte man bequem im Nachgang anpassen?

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

                    @Mottimuc sagte in Material Design Widgets: Masonry Views Widget:

                    Wäre es ggf möglich nen Index je View einzubauen, der die Position angibt? Den könnte man bequem im Nachgang anpassen?

                    Hab ich eingebaut, wenn du testen willst aktuellen master von git ziehen, oder warten bis zur nächsten latest version

                    1 Reply Last reply
                    1
                    • ScroungerS Scrounger

                      Masonry View Widget

                      masnory.gif

                      Sämtliche Fragen zu Einstellungen (VIS Editor, Bedienung, JSON strings, etc.) des Widgets hier stellen

                      Das ist sicher besser für die Übersichtlichkeit und Dokumentation.

                      • Dokumentation
                      • Online Beispiel

                      Themen zu anderen Widgets findest du hier!

                      O Online
                      O Online
                      Oli
                      wrote on last edited by
                      #19

                      @Scrounger

                      wie kann ich verhindern, dass beim zusammenschieben der Vis, sich einzelne Komponenten überschneiden?

                      Kann ich im Masonry Views Widget eine Mindestbreite pro Spalte hinterlegen?

                      71a0655c-3ac0-4699-96b0-ff7b16eed458-image.png

                      Gruß
                      Oliver

                      ScroungerS 1 Reply Last reply
                      0
                      • O Oli

                        @Scrounger

                        wie kann ich verhindern, dass beim zusammenschieben der Vis, sich einzelne Komponenten überschneiden?

                        Kann ich im Masonry Views Widget eine Mindestbreite pro Spalte hinterlegen?

                        71a0655c-3ac0-4699-96b0-ff7b16eed458-image.png

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

                        @Oli
                        musst bei allen Komponenten mit relativer breite arbeiten

                        O 1 Reply Last reply
                        0
                        • ScroungerS Scrounger

                          @Oli
                          musst bei allen Komponenten mit relativer breite arbeiten

                          O Online
                          O Online
                          Oli
                          wrote on last edited by
                          #21

                          @Scrounger

                          danke für die schnelle Antwort, sind das feste Prozentzahlen, oder muss ich mir das berechnen?

                          Gruß
                          Oliver

                          ScroungerS 1 Reply Last reply
                          0
                          • O Oli

                            @Scrounger

                            danke für die schnelle Antwort, sind das feste Prozentzahlen, oder muss ich mir das berechnen?

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

                            @Oli
                            Das kann man nicht pauschal beantworten. Je nachdem was du haben willst.

                            Verwendest du nur prozent, dann wächst das Element natürlich um so breiter der screen wird.
                            Mit calc kannst du z.B. das Element gleich groß lassen, aber die position abhängig von der breite des screens machen. usw...

                            Einfach mal damit rumspielen, dann bekommst den dreh mit der Zeit raus.
                            Zusätzlich kannst dir auch das Online Beispiel anschauen, da hab ich das bei einiggen Beispielen so umgsetzt

                            O 1 Reply Last reply
                            0
                            • ScroungerS Scrounger

                              @Oli
                              Das kann man nicht pauschal beantworten. Je nachdem was du haben willst.

                              Verwendest du nur prozent, dann wächst das Element natürlich um so breiter der screen wird.
                              Mit calc kannst du z.B. das Element gleich groß lassen, aber die position abhängig von der breite des screens machen. usw...

                              Einfach mal damit rumspielen, dann bekommst den dreh mit der Zeit raus.
                              Zusätzlich kannst dir auch das Online Beispiel anschauen, da hab ich das bei einiggen Beispielen so umgsetzt

                              O Online
                              O Online
                              Oli
                              wrote on last edited by
                              #23

                              @Scrounger

                              ich wollte mir gerade dein Online Beispiel ansehen, leider wird es nicht aufgerufen.

                              Gruß
                              Oliver

                              1 Reply Last reply
                              0
                              • F Offline
                                F Offline
                                Fatmax
                                wrote on last edited by
                                #24

                                Bin gerade dabei meine VIS mit Material Design Widgets neu zu gestalten.
                                Bis jetzt funktioniert es einwandfrei, Danke dafür an @Scrounger für die Arbeit.

                                Ich habe nun mit den Masonry-Views herumprobiert, bekomme es aber nicht hin, dass auf meinem Samsung Galaxy Tab 10.1 der View korekt angezeigt wird.
                                Das Tablet hat eine Auflösung von 1280 x 800 px und der View wird mit Fully Kiosk-Browser im Querformat dargestellt.

                                Hier die Ansicht am Desktop PC unter Google Chrome -> dies Größe des gesamten Views im Google Chrome ist 1280px, der Rest des Fensters im Google Chome ist frei:

                                vis-masonry-views-NOK.jpg

                                -> Die Anzeige schaut so aus wie sie soll.

                                Hier die Ansicht am Tablet im Fully Kiosk Browser:

                                vis-masonry-views-NOK.jpg

                                -> die einzelnen Views werden untereinander dargestellt, was nicht gewünscht ist.

                                Hier die VIS-Einstellungen:

                                vis-masonry-views-Einstellungen.jpg

                                Was kann es hier haben?
                                Ich finde den Fehler nicht.

                                Liebe Grüße,
                                Fatmax

                                ScroungerS 1 Reply Last reply
                                0
                                • F Fatmax

                                  Bin gerade dabei meine VIS mit Material Design Widgets neu zu gestalten.
                                  Bis jetzt funktioniert es einwandfrei, Danke dafür an @Scrounger für die Arbeit.

                                  Ich habe nun mit den Masonry-Views herumprobiert, bekomme es aber nicht hin, dass auf meinem Samsung Galaxy Tab 10.1 der View korekt angezeigt wird.
                                  Das Tablet hat eine Auflösung von 1280 x 800 px und der View wird mit Fully Kiosk-Browser im Querformat dargestellt.

                                  Hier die Ansicht am Desktop PC unter Google Chrome -> dies Größe des gesamten Views im Google Chrome ist 1280px, der Rest des Fensters im Google Chome ist frei:

                                  vis-masonry-views-NOK.jpg

                                  -> Die Anzeige schaut so aus wie sie soll.

                                  Hier die Ansicht am Tablet im Fully Kiosk Browser:

                                  vis-masonry-views-NOK.jpg

                                  -> die einzelnen Views werden untereinander dargestellt, was nicht gewünscht ist.

                                  Hier die VIS-Einstellungen:

                                  vis-masonry-views-Einstellungen.jpg

                                  Was kann es hier haben?
                                  Ich finde den Fehler nicht.

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

                                  @Fatmax
                                  Width und height unter allgemein muss einen relativen Wert haben und keinen absoluten.
                                  Nimm hier bei beiden 100% dann wird auf dem destop und tablet die volle breite verwendet und ist responsiv

                                  Schau dir am besten dazu das online Beispiel an:
                                  https://github.com/Scrounger/ioBroker.vis-materialdesign#online-example-project

                                  1 Reply Last reply
                                  0
                                  • F Offline
                                    F Offline
                                    Fatmax
                                    wrote on last edited by
                                    #26

                                    Hat leider auch nicht funktioniert.
                                    Habe auch die Einstellungen aus dem Beispiel 1:1 übernommen, ebenfalls der selbe Fehler.
                                    Keine Ahnung woran es liegt.

                                    Ich mache jetzt das Design nur mit "View in Widget" für das Tablet.
                                    Ein responsive Design für das Mobiltelefon brauche ich nicht.

                                    Liebe Grüße,
                                    Fatmax

                                    ScroungerS 1 Reply Last reply
                                    0
                                    • F Fatmax

                                      Hat leider auch nicht funktioniert.
                                      Habe auch die Einstellungen aus dem Beispiel 1:1 übernommen, ebenfalls der selbe Fehler.
                                      Keine Ahnung woran es liegt.

                                      Ich mache jetzt das Design nur mit "View in Widget" für das Tablet.
                                      Ein responsive Design für das Mobiltelefon brauche ich nicht.

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

                                      @Fatmax
                                      Max Mal nen Export von dem Widget oder noch besser exportier dein Projekt, damit ich die eingebundenen Views sehe.
                                      Das muss funktionieren

                                      P 1 Reply Last reply
                                      0
                                      • ScroungerS Scrounger

                                        @Fatmax
                                        Max Mal nen Export von dem Widget oder noch besser exportier dein Projekt, damit ich die eingebundenen Views sehe.
                                        Das muss funktionieren

                                        P Offline
                                        P Offline
                                        PatrickFro
                                        wrote on last edited by PatrickFro
                                        #28

                                        @Scrounger Gibt es eine Möglichkeit das Mansonry-Widget für phantomjs "sichtbar" zu machen? Ich muss mir monatlich mehrere Bilder einer View zusenden, für die ich Mansonry nutze. Nur leider erscheint eine leere Seite. Erstelle ich das Bild per phantomjs von einer der darin genutzten Views, funktioniert es.

                                        Ich hoffe es gibt eine Lösung, hab eine Woche an der Seite gebastelt. Es gibt dann sicherlich auch nen Kaffee ;-)

                                        ScroungerS 1 Reply Last reply
                                        0
                                        • P PatrickFro

                                          @Scrounger Gibt es eine Möglichkeit das Mansonry-Widget für phantomjs "sichtbar" zu machen? Ich muss mir monatlich mehrere Bilder einer View zusenden, für die ich Mansonry nutze. Nur leider erscheint eine leere Seite. Erstelle ich das Bild per phantomjs von einer der darin genutzten Views, funktioniert es.

                                          Ich hoffe es gibt eine Lösung, hab eine Woche an der Seite gebastelt. Es gibt dann sicherlich auch nen Kaffee ;-)

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

                                          @PatrickFro
                                          Ich versteh überhaupt nicht was du machen willst und wofür die phantonjs sein soll.

                                          Bei Bilder nimm htlm oder Image Widget Pack das in ne View und dann die View ins masonry.

                                          P 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

                                          644

                                          Online

                                          32.6k

                                          Users

                                          82.1k

                                          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