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.
    • Scrounger
      Scrounger Developer @darkbrain85 last edited by

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

      Das funktioniert für mich erstmal ganz gut. Je kleiner der padding Wert ist, desto mehr rutschen die Legendeneinträge aneinander. Das kann man aber mit Leerzeichen korrigieren. In so fern erstmal funktional, wenn auch noch nicht 100% sauber.

      Besser geht es leider nicht, da die chartjs api nur padding zur verfügung stellt und nicht explizit padding-left, padding-right, etc. Da die charts gerendert werden, kann ich hier nix machen.

      Da fällt mir noch was auf: Mache ich drei Leerzeichen am Ende des Legendentextes, wird direkt hinter dem letzten Buchstaben ein Punkt (.) eingefügt.

      Ich sehe weder in dem Screenshot einen . noch kann ich das bei mir reproduzieren. Leerzeichen wird als leerzeichen ausgegeben.

      Edit2: Kann man die Angabe der Uhrzeit auf der X-Achse noch schöner bekommen?

      Ja steht in der doku!

      Edit3: Es wäre gut, wenn für den Tooltip dann auch die Füllfarbe genommen wird, wenn die Linienfarbe "transparent" ist.

      Geht nicht, api nimmt immer die Farbe von der Linie.
      Dann würde ich dir empfehlen, für Linien und Füllfarbe die gleiche zu nehmen und Liniendicke auf 0 zu setzen.
      Oder blende in im Tooltip das farbfeld aus.

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

        Alerts Widget ist fertig:

        alerts.gif

        Damit kann man sich z.B. Nachrichten direkt in der VIS anzeigen, z.B. so wie das mit dem Pushover adapter möglich ist, eben nur direkt in der VIS.

        Wie man das Widget nutzen kann steht in der Doku https://github.com/Scrounger/ioBroker.vis-materialdesign#alerts

        Oder schaut Euch das online beispiel an: https://github.com/Scrounger/ioBroker.vis-materialdesign#online-example-project

        Um das Widget nutzen zu können, müsst ihr euch die Objekte mit javascript zusammenbauen.

        Archimedeus A I S D 4 Replies Last reply Reply Quote 0
        • D
          dos1973 last edited by

          Wirklich Coole Sache! Top

          Scheitert bei mir allerdings am Java.
          Hoffe auf Beispiele

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

            @Scrounger
            Hallo, was du machst ist saucool, aber murkse noch mit den Anfängen herum.

            Fragen:

            • Wo kann man anschauen, wie die Listen gemacht sind (die in der Doku abgebildet sind). In der Life-view sind sie nicht
            • Gibt es eine einfache Möglichkeit, List-Items abhängig vom Status anzeigen zu lassen oder nicht?
            • Kann man eine View in Masonry views als Navi-Button definieren?

            Warum will ich das? Ich möchte eine Statusübersicht bauen, wo auf den Karten drauf steht wieviel Lampen an sind (oder Heizkörper etc). Wenn man drauftappt soll man die Liste der Lampen bekommen mit Schaltern, die an sind.
            Eine Karte mit Navi bekomme ich hin, indem ich in der View einen unsichtbaren Button drüberlege. Ist aber unpraktisch beim Bauen.
            Fernziel: Maximale Nutzervereinfachung.

            Danke im Voraus. Ich nehme auch kommentarlose Links 🙂
            Archi

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

              @Archimedeus-A sagte in Test Adapter Material Design Widgets v0.2.x:

              • Wo kann man anschauen, wie die Listen gemacht sind (die in der Doku abgebildet sind). In der Life-view sind sie nicht

              Ja ist noch nicht alles in der Lifeview abgebildet.
              Wie die List funktioniert sieht man in der Doku - Screenshot. Am besten mal damit rumspielen, dann bekommst den dreh sicher raus.
              In den Threads hier gibt es auch das ein oder andere Beispiel zum List Widget.

              • Gibt es eine einfache Möglichkeit, List-Items abhängig vom Status anzeigen zu lassen oder nicht?

              Ja das kannst damit machen. Für Lichter nimmst am besten type switch.

              • Kann man eine View in Masonry views als Navi-Button definieren?

              Klar, leg über die gesamte Card z.B. einen Navbutton mit Layout text. Dem weißt dann die View zu, wo du die lichter mit steuerst.

              Sorry aber im Detail antworten fehlt mir echt die Zeit.
              Ließ dich hier im Forum ein, probier ein bissle rum und wenn du an nem speziellen Fall hängst, dann frag im Forum nach.

              Archimedeus A 1 Reply Last reply Reply Quote 0
              • I
                intruder7 @Scrounger last edited by intruder7

                @Scrounger Auf die Schnelle getestet:

                Fehler bisher... Sollte der Text länger als die Breite sein, schreibt er ihn über das Widget hinaus und der Bestätigungsbutton ist auch weg
                c1a61c35-ec37-4eef-be54-716a27909a8a-image.png

                Alles was an Buttons hinter dem Widget liegt ist nicht mehr bedienbar. Auch wenn keine Alerts angezeigt werden.

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

                  @Scrounger Danke, ich fummel mich durch!

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

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

                    Alerts Widget ist fertig:

                    Um das Widget nutzen zu können, müsst ihr euch die Objekte mit javascript zusammenbauen.

                    Das finde ich ja mal richtig spannend.

                    Falls jemand hier mal ein Javascript Beispiel veröffentlichen möchte.... 👏

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

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

                      Um das Widget nutzen zu können, müsst ihr euch die Objekte mit javascript zusammenbauen.

                      Hab das ganze mal versucht über Blockly zu erstellen (so baue ich mir auch die json fürs Tabellen-Widget zusammen).

                      Allerdings ist das Ergebnis hier ein Array, kein json - Fehler in Blockly?

                      b8d2af0d-bf95-4e9f-8f4c-46a3086d53be-grafik.png

                      5b422b32-c493-42df-b9aa-88d76ddbd1b9-grafik.png

                      9e5105a4-8103-4e51-9774-d8eade4cabd1-grafik.png

                      [["text","we have a new message"],["text","we have a new message"],["text","we have a new message"],["text","we have a new message"],["text","we have a new message"],["text","we have a new message"]]
                      

                      Edit: Dein Beispiel für den ical Adapter hilft hier weiter:
                      https://forum.iobroker.net/topic/26925/test-adapter-material-design-widgets-v0-2-x/582

                      Kann es sein, das es für Blockly push() nicht gibt?

                      1 Reply Last reply Reply Quote 0
                      • I
                        intruder7 @skokarl last edited by

                        @skokarl

                        Hier mal ganz schnell mit dem Telegram Adapter getestet. Alles was ich an mein zuhause schicke wird dann angezeigt.

                        var instanz = 'javascript.0'; instanz = instanz + '.';     // Instanz fuer die Datenpunkte definieren
                        var pfad = 'VIS.';
                        
                        var AlertText = instanz + pfad + "Alerts.AlertText";
                        
                        createState(AlertText, "", { type: 'string', name: '', read: true, write: true });
                        
                        let Alert = [];
                        on({id: 'telegram.0.communicate.request', change: 'any'}, function (obj) {
                            var stateval = getState('telegram.0.communicate.request').val;              // Statevalue in Variable schreiben
                            var benutzer = stateval.substring(1,stateval.indexOf("]"));                 // Benutzer aus Statevalue extrahieren
                            var befehl = stateval.substring(stateval.indexOf("]")+1,stateval.length);   // Befehl/Text aus Statevalue extrahieren
                        
                                Alert.push({
                                    text: befehl,
                                    backgroundColor: '',
                                    borderColor: 'darkred',
                                    icon: 'message-alert-outline',
                                    iconColor: 'darkred',
                                    fontColor: 'blue' 
                                })
                         setState(AlertText, JSON.stringify(Alert), true);
                         Alert = []
                        });     
                        
                        S 1 Reply Last reply Reply Quote 1
                        • S
                          skokarl @intruder7 last edited by

                          @intruder7

                          super, besten Dank.
                          Hab ich mal etwas damit ich es verstehen kann.

                          1 Reply Last reply Reply Quote 0
                          • M
                            Mr.Oz last edited by

                            Hallo zusammen,

                            seit der Version 0.2.32 / 0.2.40 funktioniert das vibrieren auf Mobilgeräten nicht mehr. Muss man da noch was beachten/umstellen?

                            Gruß

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

                              Folgendes Skript könnt ihr euch als gobales Skript speichern

                              var materialDesignWidgets = {};
                              materialDesignWidgets.sendTo = function (id, text, backgroundColor = '', borderColor = '', icon = '', iconColor = '', fontColor = '') {
                                  let json = getState(id).val;
                              
                                  json = JSON.parse(json);
                              
                                  json.push(
                                      {
                                          text: text,
                                          backgroundColor: backgroundColor,
                                          borderColor: borderColor,
                                          icon: icon,
                                          iconColor: iconColor,
                                          fontColor: fontColor
                                      }
                                  )
                              
                                  setState(id, JSON.stringify(json), true);
                              }
                              

                              und dann in anderen skripten mit

                              materialDesignWidgets.sendTo('0_userdata.0.materialdesignwidgets.alerts.json', 'neuer Text', 'red');
                              

                              neue narichten schicken.

                              @Mr-Oz sagte in Test Adapter Material Design Widgets v0.2.x:

                              seit der Version 0.2.32 / 0.2.40 funktioniert das vibrieren auf Mobilgeräten nicht mehr. Muss man da noch was beachten/umstellen?

                              Kann ich nicht bestätigen. Welcher Browser? Welches Widget? Was steht in der console des browsers?

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

                              Fehler bisher... Sollte der Text länger als die Breite sein, schreibt er ihn über das Widget hinaus und der Bestätigungsbutton ist auch weg
                              Alles was an Buttons hinter dem Widget liegt ist nicht mehr bedienbar. Auch wenn keine Alerts angezeigt werden.

                              Hab ich behoben. Zeilenumbruch funktioniert aber nur nach wörtern!

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

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

                                0_userdata.0.materialdesignwidgets.alerts.json

                                Muss der DP angelegt werden?

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

                                  @Scrounger

                                  Zeilenumbruch funktioniert. Allerdings lässt sich alles was hinter dem widget ist noch nicht bedienen. Auch wenn keine Alerts angezeigt werden

                                  I 1 Reply Last reply Reply Quote 0
                                  • I
                                    intruder7 @sigi234 last edited by

                                    @sigi234
                                    ja das muss ein existenter DP sein

                                    sigi234 1 Reply Last reply Reply Quote 0
                                    • I
                                      intruder7 @intruder7 last edited by intruder7

                                      @Scrounger
                                      hab den Fehler.. Bei der Höhe war 100% eingestellt. Einfach das Feld leer lassen und er passt die Höhe automatisch an und stört oder verdeckt auch nicht mehr die darunter liegenden Elemente

                                      I Scrounger 2 Replies Last reply Reply Quote 0
                                      • I
                                        intruder7 @intruder7 last edited by

                                        @Scrounger
                                        Beim Input Widget hab ich noch eine Frage
                                        Der Text "Bitte einen Artikel eingeben" lässt sich nicht nach rechts einrücken.

                                        df968530-3b55-4315-a43d-8c3e0b2ce854-image.png

                                        hab es hier versucht aber ohne erfolg

                                        d5504f14-4b64-4bbd-95f4-852e16a08919-image.png

                                        aber hier ist es möglich

                                        5b930730-ae3e-457a-bd51-2b0f1af69f04-image.png

                                        ub.privat 1 Reply Last reply Reply Quote 0
                                        • sigi234
                                          sigi234 Forum Testing Most Active @intruder7 last edited by

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

                                          @sigi234
                                          ja das muss ein existenter DP sein

                                          avascript.0	2020-01-26 14:43:30.625	error	(5968) at Script.runInContext (vm.js:133:20)
                                          javascript.0	2020-01-26 14:43:30.625	error	(5968) at script.js.Alarm.SendTo_Material_Vis:1:23
                                          javascript.0	2020-01-26 14:43:30.625	error	(5968) at Object.materialDesignWidgets.sendTo (script.js.Alarm.SendTo_Material_Vis:85:10)
                                          javascript.0	2020-01-26 14:43:30.625	error	(5968) TypeError: json.push is not a function
                                          javascript.0	2020-01-26 14:43:30.625	error	(5968) ^
                                          javascript.0	2020-01-26 14:43:30.625	error	(5968) json.push(
                                          javascript.0	2020-01-26 14:43:30.624	error	(5968) script.js.Alarm.SendTo_Material_Vis: script.js.Alarm.SendTo_Material_Vis:85
                                          
                                          I Scrounger 3 Replies Last reply Reply Quote 0
                                          • I
                                            intruder7 @sigi234 last edited by

                                            @sigi234 zeig mal dein skript

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

                                            Support us

                                            ioBroker
                                            Community Adapters
                                            Donate

                                            940
                                            Online

                                            31.6k
                                            Users

                                            79.5k
                                            Topics

                                            1.3m
                                            Posts

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