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

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

    • ioBroker goes Matter ... Matter Adapter in Stable

    • Monatsrückblick - April 2025

    Test Adapter Material Design Widgets v0.2.x

    This topic has been deleted. Only users with topic management privileges can see it.
    • sigi234
      sigi234 Forum Testing Most Active @Scrounger last edited by Scrounger

      @Scrounger sagte in Material Design Widgets: Calendar Widget:

      @sigi234 sagte in Material Design Widgets: Calendar Widget:

      Fehler kommt auch schon wenn ich keine ID setze, also sobald ich das Widget in die Vis ziehe.

      Achja javascript kann schon zickig sein 😉
      Habs gefunden, bitte aktuellen master testen.

      Leider geht es noch nicht.( V 0.2.52)

      Bei reinziehen:

      Screenshot (1653).png

      Nach einfügen der ID:
      Screenshot (1654)_LI.jpg

      Edit: in testing thread verschoben, da es fehlerbehbung betrifft und nicht die Einstellung des Widgets

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

        @sigi234

        @sigi234 sagte in Material Design Widgets: Calendar Widget:

        Bei reinziehen:
        Screenshot (1653).png

        Das ist eine Fehlermeldung die von der vuetify api kommt, kann ignoriert werden.

        Nach einfügen der ID:
        Screenshot (1654)_LI.jpg

        Kann ich nicht reproduzieren. Brauch zwingend den Wert deines verwendeten Objektes!

        Edit: in testing thread verschoben, da es fehlerbehbung betrifft und nicht die Einstellung des Widgets

        sigi234 1 Reply Last reply Reply Quote 0
        • Scrounger
          Scrounger Developer @J.A.R.V.I.S. last edited by Scrounger

          @J-A-R-V-I-S
          Ah das ist die entscheidende Info die mir gefehlt hat, wusste nicht das es neben dem ical Adapter noch einen weiteren Calendar Adapter gibt.
          Schau ich mir an, ob man den auch integrieren kann.

          Edit: in testing thread verschoben, da es fehlerbehbung betrifft und nicht die Einstellung des Widgets

          J.A.R.V.I.S. 1 Reply Last reply Reply Quote 0
          • J.A.R.V.I.S.
            J.A.R.V.I.S. Developer @Scrounger last edited by Scrounger

            @Scrounger wenn du Hilfe benötigst, sag bescheid. Ich könnte sonst auch noch weitere DPs im Adapter zur Verfügung stellen.

            Edit: in testing thread verschoben, da es fehlerbehbung betrifft und nicht die Einstellung des Widgets

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

              @Scrounger
              @J-A-R-V-I-S

              Ich habe einfach eure Kalender verwechselt.
              Aber so findet ihr zueinander. 😀

              Edit: in testing thread verschoben, da es fehlerbehbung betrifft und nicht die Einstellung des Widgets

              1 Reply Last reply Reply Quote 0
              • Scrounger
                Scrounger Developer @J.A.R.V.I.S. last edited by Scrounger

                @J-A-R-V-I-S
                Das wäre natürlich top, wenn du einen Datenpunkt zur Verfügung stellst, der out of the box mit dem widget funktioniert.

                Datenpunkt muss ein String sein, der wie folgt aussieht:

                [
                	{
                		"name": "Event",
                		"color": "#e74c3c",
                		"colorText": "#FFFFFF",
                		"start": "2020-01-24",
                		"end": "2020-01-26"
                	},
                	{
                		"name": "Meeting",
                		"color": "#717d7e",
                		"colorText": "#FFFFFF",
                		"start": "2020-03-23",
                		"end": "2020-03-24"
                	}
                ]
                

                Wichtig bei ganztägien Ereignissen darf nur das Datum bei start und end propertie drin sein:

                		"start": "2020-03-23",
                		"end": "2020-03-24"
                

                Bei Terminen muss noch die Zeit mit dazu, in folgendem Format (24h):

                		"start": "2020-01-24 16:00",
                		"end": "2020-01-26 17:15"
                

                Lass uns am besten über telegramm weiter kommunizieren

                Edit: in testing thread verschoben, da es fehlerbehbung betrifft und nicht die Einstellung des Widgets

                J.A.R.V.I.S. 1 Reply Last reply Reply Quote 0
                • J.A.R.V.I.S.
                  J.A.R.V.I.S. Developer @Scrounger last edited by

                  @Scrounger ich glaube, meine Datenpunkte haben schon eine ahnliche Struktur.

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

                  Lass uns am besten über telegramm weiter kommunizieren

                  Können wir sehr gerne machen.

                  1 Reply Last reply Reply Quote 0
                  • C
                    cmorlok last edited by

                    @Scrounger (Sorry, wenn das schon mal beantwortet wurde, aber ich habe nichts gefunden)

                    Was ist beste Entwicklungsprozess für Widgets? Kann am irgendwo im laufenden Vis die Dateien editieren? Wie machst Du das? Oder geht alles über git und einem (zeitintensiven) Update des Adapters?

                    Scrounger 1 Reply Last reply Reply Quote 0
                    • ub.privat
                      ub.privat @Scrounger last edited by Scrounger

                      @Scrounger

                      Hallo, leider ich schon wieder...
                      Nachdem das System nun wieder stabil und korrekt läuft, habe ich mich dem neuen Script angenommen.
                      Der DP wird richtig angelgt und ich habe diesen im Widget angezogen.
                      Verhalten nach wie vor identisch.

                      Im Editor werden die Daten OHNE Kalenderfarben angezeigt, in der RunTime ist nur ein leerer Kalender zu sehen.
                      Kurzum identisches Verhalten, wie mit dem "alten" DP.
                      D.h. es muss einen anderen Fehler geben????

                      Grüße

                      Edit: in testing thread verschoben, da es fehlerbehbung betrifft und nicht die Einstellung des Widgets

                      Scrounger 1 Reply Last reply Reply Quote 0
                      • M
                        mctom @Scrounger last edited by

                        Diese Material Design kann einem ja echt den Kopf zerbrechen. Man hat so viele Ideen. 🙂

                        Wenn man die Widgets installiert hat, stehen in den Widgets ja auch die Icons von https://materialdesignicons.com/ zur Verfügung.

                        Ich würde jetzt an verschiedenen Stellen nur eines dieser Icons anzeigen.

                        Hat jemand eine Idee wie ich das hinbekomme?

                        Okay 🙂 beim schreiben habe ich eine Lösung gefunden:

                        Basic HTML widget mit folgendem Inhalt:

                        <span class="mdi mdi-lightbulb-on-outline" style="font-size: 40px"></span>
                        

                        Ich fände es cool wenn es ein fertiges Widget geben würde wo man die Icons direkt auswählen könnte.

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

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

                          @Scrounger (Sorry, wenn das schon mal beantwortet wurde, aber ich habe nichts gefunden)

                          Was ist beste Entwicklungsprozess für Widgets? Kann am irgendwo im laufenden Vis die Dateien editieren? Wie machst Du das? Oder geht alles über git und einem (zeitintensiven) Update des Adapters?

                          Infos dazu findest du hier:
                          https://forum.iobroker.net/topic/671/widget-entwicklung/2
                          https://github.com/ioBroker/ioBroker.docs/tree/master/docs/en/dev
                          https://github.com/ioBroker/ioBroker.docs/blob/master/docs/en/dev/adaptervis.md

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

                          Ich fände es cool wenn es ein fertiges Widget geben würde wo man die Icons direkt auswählen könnte.

                          Steht schon auf der Todo Liste:
                          https://github.com/Scrounger/ioBroker.vis-materialdesign/issues/52

                          Scrounger created this issue in Scrounger/ioBroker.vis-materialdesign

                          closed Material Design Icon Widget #52

                          C 1 Reply Last reply Reply Quote 0
                          • C
                            cmorlok @Scrounger last edited by

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

                            Infos dazu findest du hier:
                            https://forum.iobroker.net/topic/671/widget-entwicklung/2
                            https://github.com/ioBroker/ioBroker.docs/tree/master/docs/en/dev
                            https://github.com/ioBroker/ioBroker.docs/tree/master/docs/en/dev/adaptervis.md

                            Danke, die Doku habe ich auch schon gelesen. Was mich aber verwirrt ist dieser Absatz:

                            replace index.html and edit.html replace files in /opt/iobroker/iobroker-data/files/vis/index.html and edit.html with files from /opt/iobroker/node_modules/iobroker.vis/www/index.html.original and edit.html.original. Change the file /opt/iobroker/iobroker-data/files/vis/cache.manifest. No matter what, just one symbol to trigger the browser to load files anew. The files must be smaller than 200k. If you have got wrong files, so they are definitly largen than 400k.

                            Warum sollte ich das tun? Die .original-Dateien gibt es noch nicht einmal?! (In der deutschen Übersetzung ist das noch seltsamer formuliert).

                            Weshalb ich aber eigentlich frage ist Folgendes. Vis läd bei mir /opt/iobroker/iobroker-data/files/vis/widgets/materialdesign/js/widgets.min.js, das ja den Inhalt von vis/widgets/materialdesign/js/* enthält. Muss ich diese Datei jeweils neu erzeugen? Wenn ja, wie? Oder kann ich vis irgendwie dazu bringen, die Javascript-Quellen zu laden statt der minified?

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

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

                              Warum sollte ich das tun? Die .original-Dateien gibt es noch nicht einmal?! (In der deutschen Übersetzung ist das noch seltsamer formuliert).

                              Das kann ich dir im Detail auch nicht beantworten. Mit diesen Einstellung erreichst du, dass die Änderungen im Code direkt beim neuladen der VIS / Runtime übernommen werden.

                              Weshalb ich aber eigentlich frage ist Folgendes. Vis läd bei mir /opt/iobroker/iobroker-data/files/vis/widgets/materialdesign/js/widgets.min.js, das ja den Inhalt von vis/widgets/materialdesign/js/* enthält. Muss ich diese Datei jeweils neu erzeugen? Wenn ja, wie? Oder kann ich vis irgendwie dazu bringen, die Javascript-Quellen zu laden statt der minified?

                              Ja musst du. Ich verwende als IDE VS Code und das plugin Minify - das erzeugt nach Änderungen direkt die minified files.
                              Alternativ kannst du auch die js files verwenden, musst dann in der materialdesign.html entsprechend definieren. Achtung reihenfolge ist hier wichtig, helper dateien müssen zuerst imptiert werden.

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

                                IconList Widget ist fertig. Den Nutzern von lovelace könnte das bekannt vorkommen 😉

                                Bei dem Widget können z.B. Funktionen Toggle, State, Navigation, Link jetzt für jedes einzelne Element eingestellt werden. Weiter könnt Ihr per json string das Widget komplett dynamisch per skript erzeugen.

                                iconList.gif iconList.gif

                                Wer es testen möchte, aktuellen master ziehen -> v.0.2.57

                                Fragen zu Einstellungen des Widgets bitte hier posten!!!
                                https://forum.iobroker.net/topic/30331/material-design-widgets-iconlist-widget

                                1 Reply Last reply Reply Quote 0
                                • Scrounger
                                  Scrounger Developer @ub.privat last edited by

                                  @ub-privat
                                  Hab wie besprochen jetzt noch was eingebaut. Bitte teste mal die aktuelle version von git -> v0.2.58.
                                  Nach der installation ein iobroker update vis ausführen und danach einen neustart von iob.

                                  ub.privat 1 Reply Last reply Reply Quote 0
                                  • ub.privat
                                    ub.privat @Scrounger last edited by

                                    @Scrounger

                                    ...leider keine Veränderung, alles leider wie vorher.
                                    Bin deinen Anleitungen gefolgt, habe auch Widget NEU angelegt.
                                    Im Editor ist alles ok, in der RUNTIME leider nur das nackte Widget ohne Inhalte.

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

                                      @Scrounger
                                      Ich habe ein ähnliches Problem mit dem select-widget. ich möchte gerne einen Datenpunkt "number" ändern. Habe die Werteliste soweit ausgefüllt. Beim Start der Runtime ist der angezeigte Wert leer. Wähle ich einen Wert aus, bleibt dieser bestehen. Allerdings nur solange wie der Datenpumkt sich nicht aktualisiert. Kommt ein Refresh des Datenpunktes, ist die Runtime wieder leer. Ich habe zum Vergleich nochmal ein jpui - select ValueList daneben (links) gelegt, dort passt alles.

                                      select.gif

                                      Der Datenpunkt sieht wie folgt aus:

                                      objekt.png

                                      objekt2.png

                                      Mein Widget dazu:

                                      [{"tpl":"tplVis-materialdesign-Select","data":{"oid":"mihome-vacuum.0.control.fan_power","g_fixed":false,"g_visibility":false,"g_css_font_text":false,"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","inputType":"text","inputLayout":"outlined-rounded","showInputMessageAlways":false,"showInputCounter":false,"clearIconShow":false,"listDataMethod":"valueList","countSelectItems":"0","listPosition":"auto","showSelectedIcon":"no","showValue":false,"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,"inputLayoutBorderColor":"#FFCA28","inputLayoutBorderColorSelected":"white","inputLabelText":"","inputLabelColor":"#FFCA28","inputLabelFontFamily":"RobotoCondensed-Regular","inputTranslateX":"15","inputTranslateY":"","valueListLabels":"Leise,Ausgeglichen,Turbo,Maximum,5%,10%,15%,20%,25%,30%,35%,40%,45%,50%,55%,65%,70%,75%,80%,85%,95%,100%","valueList":"38,60,77,90,5,10,15,20,25,30,35,40,45,50,55,65,70,75,80,85,95,100","listItemBackgroundColor":"#263238","listItemBackgroundHoverColor":"#37474F","listItemBackgroundSelectedColor":"#37474F","listItemRippleEffectColor":"","listIconColor":"","listItemFontColor":"#ffffff","listItemFontHoverColor":"#ffffff","inputTextColor":"white","inputLabelColorSelected":"#FFCA28","inputAppendixColor":"","inputCounterColor":"","clearIconColor":"","prepandIconSize":"","prepandIconColor":"","prepandInnerIconColor":"","appendOuterIcon":"","listItemSubFontColor":"","listItemSubFontHoverColor":"#FFCA28","inputLayoutBackgroundColor":"","inputLayoutBackgroundColorHover":"#37474F","inputLayoutBorderColorHover":"#00838f","inputTextFontFamily":"RobotoCondensed-Regular","prepandIcon":"","jsonStringObject":"","valueListIcons":"","inputPrefix":"    ","inputMessage":"","inputLabelFontSize":"","listItemFontSelectedColor":"#ffffff","listItemSubFontSelectedColor":"#FFCA28"},"style":{"left":"380px","top":"199px","z-index":"10","width":"216px","height":"38px"},"widgetSet":"materialdesign"}]
                                      

                                      Kann es sein das das Select Widget Probleme mit dem Datentyp "number" hat?
                                      Zumindest funktioniert es mit einem String wunderbar.

                                      Edit: in testing thread verschoben, da es fehlerbehbung betrifft und nicht die Einstellung des Widgets

                                      Scrounger 2 Replies Last reply Reply Quote 0
                                      • Scrounger
                                        Scrounger Developer @0018 last edited by Scrounger

                                        @0018
                                        Also bei mir funktioniert number datenpunkte wunderbar.
                                        Allerdings scheint das irgendwas spezielles bei dir zu sein weil das steht 25%(25), hab ich so noch nicht gesehen.

                                        Poste bitte mal die raw Daten des Datenpunktes, dann schau ich mir das an.

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

                                          @Scrounger
                                          Ist aus dem aktuellen mihome-vacuum Adapter.
                                          Hier die raw:

                                          {
                                           "from": "system.host.BrokerNUC.cli",
                                           "ts": 1578613960883,
                                           "common": {
                                             "name": "Suction power",
                                             "type": "number",
                                             "role": "level",
                                             "max": 100,
                                             "read": true,
                                             "write": true,
                                             "states": {
                                               "5": "5%",
                                               "10": "10%",
                                               "15": "15%",
                                               "20": "20%",
                                               "25": "25%",
                                               "30": "30%",
                                               "35": "35%",
                                               "38": "QUIET",
                                               "40": "40%",
                                               "45": "45%",
                                               "50": "50%",
                                               "55": "55%",
                                               "60": "BALANCED",
                                               "65": "65%",
                                               "70": "70%",
                                               "75": "75%",
                                               "77": "TURBO",
                                               "80": "80%",
                                               "85": "85%",
                                               "90": "MAXIMUM",
                                               "95": "95%",
                                               "100": "100%"
                                             }
                                           },
                                           "native": {},
                                           "acl": {
                                             "object": 1636,
                                             "owner": "system.user.admin",
                                             "ownerGroup": "system.group.administrator",
                                             "state": 1636
                                           },
                                           "_id": "mihome-vacuum.0.control.fan_power",
                                           "type": "state"
                                          }
                                          

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

                                            Update auf 0.2.59 durchgeführt...wieder zurück auf 0.2.49.

                                            Nach dem Update diverse Widget Informationen verloren gegangen...Diverse Widgets mussten im Vis Editor neu konfiguriert werden...Meist der Textinhalt und die Farbe des Textest und auch die Anzahl der Spalten des Bool List widget..Ausserdem beim Bedienen des bool list widget waren andere widgets in der view nicht mehr aktiv.
                                            FullyBrowser als auch firefox)
                                            Da life system nicht lange getestet und gleich wieder zurück...

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

                                            Support us

                                            ioBroker
                                            Community Adapters
                                            Donate

                                            514
                                            Online

                                            31.7k
                                            Users

                                            79.7k
                                            Topics

                                            1.3m
                                            Posts

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