Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Tester
    4. Test Adapter Material Design Widgets v0.2.x

    NEWS

    • 15. 05. Wartungsarbeiten am ioBroker Forum

    • Monatsrückblick - April 2025

    • Minor js-controller 7.0.7 Update in latest repo

    Test Adapter Material Design Widgets v0.2.x

    This topic has been deleted. Only users with topic management privileges can see it.
    • N
      nousefor82 last edited by nousefor82

      So, die TopBar funktioniert soweit, außer, dass er Anfangs meckert, dass er eine View nicht findet. Das gibt sich dann aber mit der Zeit.

      Eine Frage noch zum Layout der TopBar. Ist es möglich die Buttons der Liste "höher" zu machen, bzw. den Abstand der einzelnen Einträge zueinander zu vergrößern?

      Danke!

      EDIT: Doch nicht...

      Nach einiger Zeit sehe ich nicht mehr den HomeScreen sonder nur das Widget...

      Woran kann das liegen?

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

        @dos1973 sagte in Test Adapter Material Design Widgets v0.2.x:

        @Scrounger

        Hi, kurze Frage, gibt/ gäbe es die Möglichkeit, dass Du noch einen Farbwert zur Verfügung stellt, wenn der Switch inaktiv ist.

        Bei dunklen Screens wäre das Klasse.

        Bildschirmfoto 2019-11-22 um 17.38.42.png

        Danke Dir

        Hab's in den aktuellen master Branch eingebaut.

        1 Reply Last reply Reply Quote 1
        • B4n4n3
          B4n4n3 last edited by

          Hallo @Scrounger

          du hast mit dem Update 0.2.0 " colorSchemes for Charts" hinzugefügt.
          Hierzu hab ich eine Frage: Kann ich die Farbangaben wie "material.brown" irgendwie verwenden?
          Kann man die in CSS eintragen und das Farbkonzept wird angewendet?

          farben.JPG

          Falls es bereits einen Thread dazu gab, wäre ein Link super.

          Vielen Dank für die Hilfe.

          Grüße B4n4n3

          Scrounger 1 Reply Last reply Reply Quote 0
          • D
            davimas last edited by

            Hey,

            Gerade ein neues Projekt angelegt und die Widgets rübergezogen. Im Editor ist alles da - wenn ich dann per VIS App darauf zugreife dann werden die Widgets nicht angezeigt.

            Normale Standard Widgets schon. Also ist dieser Adapter inkompatibel mit der ioBroker App?

            Meistertr 1 Reply Last reply Reply Quote 0
            • Meistertr
              Meistertr Developer @davimas last edited by

              @davimas die widget müssen noch in die app integriert werden

              D 1 Reply Last reply Reply Quote 1
              • Scrounger
                Scrounger Developer @B4n4n3 last edited by

                @B4n4n3 sagte in Test Adapter Material Design Widgets v0.2.x:

                Hallo @Scrounger

                du hast mit dem Update 0.2.0 " colorSchemes for Charts" hinzugefügt.
                ...
                Kann man die in CSS eintragen und das Farbkonzept wird angewendet?

                Die ColorSchemes sind nur bei den Charts einsetzbar, kann man im Editor auswählen.
                Per CSS verwenden geht nicht.

                b84a500d-3a66-450b-a1d3-4cf937f18425-grafik.png

                1 Reply Last reply Reply Quote 0
                • D
                  davimas @Meistertr last edited by davimas

                  @Meistertr
                  Vielen Dank für deine Antwort.

                  1 Reply Last reply Reply Quote 0
                  • Z
                    Zipkart @Scrounger last edited by

                    @Scrounger sagte in Test Adapter Material Design Widgets v0.2.x:

                    @Zipkart
                    Hast du einen Toggle Button oder einen State Button verwendet?
                    Von welchem Typ ist der Datenpunkt?

                    Edit:
                    Mach mal nen Export von dem Widget und poste die raw daten des zugewiesenen datenpunktes.

                    Sorry dass ich mich jetzt erst melde, aber ich musst mal wieder ein Backup einspielen im Livesystem.

                    Hier ist schon mal das Widget


                    [{"tpl":"tplVis-materialdesign-Button-Toggle-vertical","data":{"oid":"hue.0.Philips_hue.Kugel_SZ.on","g_fixed":false,"g_visibility":false,"g_css_font_text":true,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","buttonStyle":"unelevated","toggleType":"boolean","stateIfNotTrueValue":"on","vibrateOnMobilDevices":"50","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"colorBgFalse":"rgb(70, 70, 70)","colorBgTrue":"#CDDC39","imageTrue":"/icons-ultimate-png/983.png","image":"/icons-ultimate-png/981.png","valueOff":"","valueOn":"","labelFalse":"","labelTrue":"","colorPress":"green"},"style":{"left":"5px","top":"410px","width":"275px","height":"130px","text-align":"center"},"widgetSet":"materialdesign"}]

                    und hier der Raw des Datenpunktes


                    {
                    "from": "system.adapter.hue.0",
                    "user": "system.user.admin",
                    "ts": 1562209210940,
                    "common": {
                    "name": "Philips_hue.Kugel_SZ.on",
                    "type": "boolean",
                    "role": "switch",
                    "read": true,
                    "write": true
                    },
                    "native": {
                    "id": "26"
                    },
                    "acl": {
                    "object": 1636,
                    "owner": "system.user.admin",
                    "ownerGroup": "system.group.administrator",
                    "state": 1636
                    },
                    "_id": "hue.0.Philips_hue.Kugel_SZ.on",
                    "type": "state"
                    }

                    Vielleicht kannst du ja helfen

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

                      Hallo zusammen,

                      ich habe ein paar Fragen zum Line History Chart.

                      1. ist es Möglich nur das Diagrammfeld einzufärben wie beim angefügten Diagramm?
                      2. Wie kann ich mir zu der Uhrzeit noch das Datum in der X-Achse anzeigen lassen?
                      3. Wie kann ich die Messeinheit in der Y-Achse anzeigen lassen?

                      8fd92afb-2a42-44b9-b390-4d4227540822-image.png

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

                        @Oli sagte in Test Adapter Material Design Widgets v0.2.x:

                        1. ist es Möglich nur das Diagrammfeld einzufärben wie beim angefügten Diagramm?

                        Nee das geht nicht, kann man aber sicher leicht einbauen - ich schau mal. Am besten wäre wenn du dazu ein Issue auf git anlegest, damit wir es nicht vergessen.

                        1. Wie kann ich mir zu der Uhrzeit noch das Datum in der X-Achse anzeigen lassen?

                        Du kannst über die Option 'time formats of x-axis' im Editor ganz individuell dein format einstellen. Ist in der Doku entsprechend beschrieben:
                        https://github.com/Scrounger/ioBroker.vis-materialdesign#line-history-chart

                        1. Wie kann ich die Messeinheit in der Y-Achse anzeigen lassen?

                        Ist noch nicht implementiert. Hier das gleiche wie oben, bitte ein issue auf github erstellen.

                        O 2 Replies Last reply Reply Quote 0
                        • O
                          Oli @Scrounger last edited by

                          @Scrounger

                          alles klar, mache ich

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

                            @Scrounger

                            sorry, aber ich habe mir deinen Link zig mal durchgelesen, aber anscheinend reicht mein Horizont dafür nicht aus. Wäre nett wenn du mir da etwas unter die Arme greifen könntest.

                            Was müsste ich in der Option 'time formats of x-axis' eingeben, damit ich zur Uhrzeit zusätzlich noch das Datum angezeigt bekomme?

                            Beim testen deines 'List Value' Wigets ist mir aufgefallen, dass man die Höhe nicht ändern kann, ist das nur bei mir so?

                            59cb7430-dae0-4e78-b0b5-73a53704ec2f-image.png

                            Ich habe leider auch keine Einstellung gefunden, wo ich die Schriftfarbe ändern kann.

                            Und noch eine letzte Frage hätte och, gibt es bei deinem Table Wigets ein Möglichkeit des Zeilenumbruchs, wenn der Text zu lang ist?
                            d8e47489-ff13-40f3-90bc-6b8c55fb85a4-image.png

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

                              @Oli sagte in Test Adapter Material Design Widgets v0.2.x:

                              Beim testen deines 'List Value' Wigets ist mir aufgefallen, dass man die Höhe nicht ändern kann, ist das nur bei mir so?

                              Layout des Listenelements

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

                                @sigi234

                                und wo finde ich das?

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

                                  @Oli sagte in Test Adapter Material Design Widgets v0.2.x:

                                  @sigi234

                                  und wo finde ich das?

                                  Screenshot (685)_LI.jpg

                                  Warte, das ist das Widget List

                                  Du meinst ja Value Select

                                  Screenshot (688)_LI.jpg

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

                                    @sigi234

                                    ich glaube wir sprechen von unterschiedlichen Widgets, ich meine das hier:

                                    f62fb49d-a87b-4745-9a71-7708bcae6212-image.png

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

                                      @Oli sagte in Test Adapter Material Design Widgets v0.2.x:

                                      @sigi234

                                      ich glaube wir sprechen von unterschiedlichen Widgets, ich meine das hier:

                                      Siehe Beitrag unten, 2.Screenshot

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

                                        @Scrounger Kurze Frage, planst du aktuell auch ein 'input' für die Texteingabe?

                                        Weiterhin alle Daumen hoch für die Arbeit hier!

                                        Und noch eine Frage:

                                        Könntest du die Schriftfarbe / Schriftart bei den Selects noch über VIS Edit Konfigurierbar machen? Aktuell bin ich da immer den Umweg über CSS gegangen.

                                        88a3e6de-91c6-40f3-886b-03639ab5a143-grafik.png

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

                                          @Oli sagte in Test Adapter Material Design Widgets v0.2.x:

                                          @Scrounger

                                          sorry, aber ich habe mir deinen Link zig mal durchgelesen, aber anscheinend reicht mein Horizont dafür nicht aus. Wäre nett wenn du mir da etwas unter die Arme greifen könntest.

                                          folgendes ist ja standardmäßig eingestellt:

                                                      {
                                                          "millisecond":    "H:mm:ss.SSS",
                                                          "second":         "H:mm:ss",
                                                          "minute":         "H:mm",
                                                          "hour":           "H",
                                                          "day":            "MMM D",
                                                          "week":           "ll",
                                                          "month":          "MMM YYYY",
                                                          "quarter":        "[Q]Q - YYYY",
                                                          "year":           "YYYY"
                                                      }
                                          

                                          Wnn du jetzt z.B. als Timeinterval 1 Stunde festgelegt hast, dann zieht er die Fomatierung von 'minute' an. Du musst dann z.B. um folgendes erweitern H:mm DD.MM.YYYY. Mögliche Formatierungen sind hier beschrieben: https://momentjs.com/docs/#/displaying/format/
                                          Einfach mal bissle rum spielen und ausprobieren, dann findet man meistens raus wie es funktioniert.

                                          Und noch eine letzte Frage hätte och, gibt es bei deinem Table Wigets ein Möglichkeit des Zeilenumbruchs, wenn der Text zu lang ist?

                                          auf die schnelle, bei 'vorangesteller Text' folgendes eintragen <span style="display: inline-block; word-wrap:break-word;"> und bei 'nachgestellter Text' folgendes eintragen </span> oder so ähnlich.

                                          @darkiop sagte in Test Adapter Material Design Widgets v0.2.x:

                                          @Scrounger Kurze Frage, planst du aktuell auch ein 'input' für die Texteingabe?

                                          Ja, da es bestandteil der mdc lib ist. Allerdings ganz niedrige prio, da ich in meiner VIS keine input felder benötige. Am besten erstelltst dafür ein issue bei github, damit wir es nicht vergessen.

                                          Könntest du die Schriftfarbe / Schriftart bei den Selects noch über VIS Edit Konfigurierbar machen? Aktuell bin ich da immer den Umweg über CSS gegangen.

                                          Ja kann ich einbauen. Hierfür bitte auch ein issue auf github erstellen, danke!

                                          O D 2 Replies Last reply Reply Quote 1
                                          • O
                                            Oli @Scrounger last edited by

                                            @Scrounger said in Test Adapter Material Design Widgets v0.2.x:

                                            danke, dass mit dem Datumsformat hab ich jetzt begriffen, aber das mit dem Zeilenumbruch klappt leider noch nicht.

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

                                            Support us

                                            ioBroker
                                            Community Adapters
                                            Donate

                                            943
                                            Online

                                            31.6k
                                            Users

                                            79.4k
                                            Topics

                                            1.3m
                                            Posts

                                            adapater material vis visualization widget
                                            77
                                            902
                                            157183
                                            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