Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Visualisierung
    4. [Projekt] Material Design CSS für ioBroker.vis

    NEWS

    • Neuer Blog: Fotos und Eindrücke aus Solingen

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

    • ioBroker goes Matter ... Matter Adapter in Stable

    [Projekt] Material Design CSS für ioBroker.vis

    This topic has been deleted. Only users with topic management privileges can see it.
    • ?
      A Former User last edited by

      Hallo,

      mit den Widgets habe ich angefangen ein paar immer wiederkehrende Gruppen zu vereinfachen. Wie es z.b. bei den Listen mit verschiedenen Sensoren bei mir der Fall war.

      Aktuell warte ich jedoch gerade etwas auf Bluefox und die weitere Planung zum ganzen Material Design für VIS.

      https://github.com/ioBroker/ioBroker.vi … va/pull/18

      Fragen, Ideen, Unterstützung, Bugs sind herzlich willkommen.

      1 Reply Last reply Reply Quote 0
      • P
        ple last edited by

        @Uhula:

        @ple:

        Daher die Frage hier, was habt ihr so draus gemacht? Ich brauch ein paar Anregungen zum nachbauen oder importieren `
        Mir war nicht einmal der MD Adapter von nisiode bekannt. Nach einem ersten Blick auf den Source steht nisiode noch am Anfang da erst wenige Widgets vorhanden sind. Aber danke für den Hinweis und die Nutzung.

        Zu deiner Frage. Die ist so allgemein, dass ich gar nicht weiß, was und wie ich antworten soll. Zudem hat jeder sicher andere Vorstellungen, wie es am Ende "aussehen" soll. Ich habe nun die letzten Scripte aus IP Symcon übernommen. ioBroker ist nun mein Produktiv-System und die vis wird nun weiter entstehen. Ich setze ausschließlich auf basic und jqui Widgets, entwerfe alle card-View responsive mit %-Angaben für left/top/width/height (da wo sinnvoll) um auf verschiedenen Endgeräten genau eine vis zu haben. Das ist aufwendig (macht aber Spaß). Wer nur für ein Tablet o.ä. entwirft, kann das ganze einfacher angehen. Beginnen solltest du mit der Navigationsstruktur.

        Wenn meine vis mir irgendwann gefällt, werde ich sie hier anonymisiert zur Verfügung stellen - oder zumindest ein Video davon 😉 `

        Ist ja auch nicht gerade einfach das zu umschreiben. Ich bin leider nicht künstlerisch begabt und kann mir sowas nicht vorstellen, wie meine Vis aussehen sollte. Im Moment bin ich nur auf der Suche nach einer alternative zu mobileui. Das ist ja schon sehr einfach gehalten und das Feature mit deinen CSS wäre der Hammer. Daher auch die Frage, ob jemand sowas bereits mal nachgebaut hat. Also das mobileui.

        baut man sich eigentlich immer aus deinen Demo / Simple Views sich seine eigenen? Oder kopiert man sich nur einzelne Widgets aus deinen Projekten und packt die in ein neues Projekt.

        Gruß und Danke

        1 Reply Last reply Reply Quote 0
        • B
          Bongo last edited by

          @Uhula:

          Ich setze ausschließlich auf basic und jqui Widgets, entwerfe alle card-View responsive mit %-Angaben für left/top/width/height (da wo sinnvoll) um auf verschiedenen Endgeräten genau eine vis zu haben. Das ist aufwendig (macht aber Spaß). Wer nur für ein Tablet o.ä. entwirft, kann das ganze einfacher angehen. Beginnen solltest du mit der Navigationsstruktur.

          Wenn meine vis mir irgendwann gefällt, werde ich sie hier anonymisiert zur Verfügung stellen - oder zumindest ein Video davon 😉 `
          Ich entwerfe die card-View mit fester größe dass es auf dem Handy passt. "responsive mit %-Angaben für left/top/width/height" würde mich interessieren. Vielleicht kannst du schon vorab einen kleinen Einblick geben.

          Danke.

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

            Hallo,

            gibt es eine Möglichkeit das Eingabefeld "jqui - ctrl - Input Datetime" im "mdui-input" design zu zentrieren? Aktuell ist es ja rechtsbündig.

            Hab schon versucht über "text-align = center" , aber ohne Veränderung.

            1620_date.png
            1620_center.png

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

              @0018:

              gibt es eine Möglichkeit das Eingabefeld "jqui - ctrl - Input Datetime" im "mdui-input" design zu zentrieren? `
              Im Moment ist es linksbündig - wie alle Input-Felder. Dieses wird direkt im HTML-Render als style-Eigenschaft gesetzt, lässt sich aber über folgenden Trick übersteuern:

              (a) Neue CSS Klasse im Projekt CSS aufnehmen:

              .mdui-input.mdui-center-horizontal input[type="text"] {

              text-align:center !important;

              }

              (b) dem Widget in den CSS Eigenschaften zusätzlich mdui-center-horizontal zuweisen

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

                > baut man sich eigentlich immer aus deinen Demo / Simple Views sich seine eigenen?
                Das kann ich gar nicht beantworten, das können nur die, welche auf der MD Basis sich eine vis anlegen (meine eigene vis war vorher schon da, ist meine Spielwiese).

                Ich vermute aber, dass der Einstieg mit der Nutzung von MD_Simple einfacher ist.

                1 Reply Last reply Reply Quote 0
                • P
                  ple last edited by

                  Ich bastel gerade mit der simple rum. Macht jedenfalls echt Spaß und sieht schon mal super aus.

                  Die Navigation ist besonders schick, daher baue ich auf die simple auf kopier mir die Blöcke raus die ich so brauche.

                  Mit Card und % Angaben mach ich mal später. So ganz hab ich es noch nicht gecheckt wie sich die view und view zusammensetzten mit Hintergrund usw. Bilder vom ersten Gehversuch stell ich nachher mal ein. Ich muss erst die Grundfunktionen fertig haben.

                  Auf Git hast du mehrere screens z.b. Wohnzimmer abgebildet, mit einem einstellrad in den Card für Temperatur. Ich denke mal, es öffnet sich ein Dialog. Sowas finde ich leider nicht in der Demo.

                  Ich hatte auch sowas vor und besonders, wenn man auf die ist Temperatur vom Raum klickt soll sich das float Diagramm öffnen.

                  Hast du vielleicht was fertiges da und kannst das mit in die Demo aufnehmen?

                  Gruß und vielen Dank und großen Respekt zu deinem Projekt.

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

                    @ple:

                    Auf Git hast du mehrere screens z.b. Wohnzimmer abgebildet, mit einem einstellrad in den Card für Temperatur. Ich denke mal, es öffnet sich ein Dialog. Sowas finde ich leider nicht in der Demo. `
                    Du meinst sicher die Einstellung der Sollwerte der Heizung. Da ich lediglich eine Fussbodenheizung habe (träge eben), wäre alles andere als genau ein Sollwert je Raum zu viel. Beim Klick auf das "Einstellradf" bzw. "Sollwerte" öffnet sich ein Dialog zur Einstellung, korrekt. Den Export der Widgets dieses Views:

                    ! ````
                    [{"tpl":"tplHtml","data":{"g_fixed":true,"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,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","refreshInterval":"0","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,"html":"Arbeitszimmer","class":"mdui-label","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},"style":{"left":"8px","top":"248px","width":"","height":""},"widgetSet":"basic"},{"tpl":"tplHtml","data":{"g_fixed":true,"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,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","refreshInterval":"0","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,"html":"Küche","class":"mdui-label","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},"style":{"left":"8px","top":"184px","width":"","height":""},"widgetSet":"basic"},{"tpl":"tplHtml","data":{"g_fixed":true,"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,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","refreshInterval":"0","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,"html":"WC","class":"mdui-label","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},"style":{"left":"8px","top":"120px","width":"","height":""},"widgetSet":"basic"},{"tpl":"tplHtml","data":{"g_fixed":true,"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,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","refreshInterval":"0","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,"html":"Wohnzimmer","class":"mdui-label","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},"style":{"left":"8px","top":"56px","width":"","height":""},"widgetSet":"basic"},{"tpl":"tplHtml","data":{"g_fixed":true,"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,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","refreshInterval":"0","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,"html":"Sollwerte Heizung EG","class":"mdui-title","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},"style":{"left":"8px","top":"8px","width":"","height":"31px"},"widgetSet":"basic"},{"tpl":"tplJquiRadioList","data":{"oid":"javascript.0.heating.setTempWZ","g_fixed":true,"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,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","values":"17;18;19;20;21;22;23","texts":"17;18;19;20;21;22;23","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,"class":"mdui-radio","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},"style":{"left":"8px","top":"72px","width":"","height":""},"widgetSet":"jqui"},{"tpl":"tplJquiRadioList","data":{"oid":"javascript.0.heating.setTempWC","g_fixed":true,"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,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","values":"17;18;19;20;21;22;23","texts":"17;18;19;20;21;22;23","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,"class":"mdui-radio","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},"style":{"left":"8px","top":"136px","width":"","height":""},"widgetSet":"jqui"},{"tpl":"tplJquiRadioList","data":{"oid":"javascript.0.heating.setTempKueche","g_fixed":true,"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,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","values":"17;18;19;20;21;22;23","texts":"17;18;19;20;21;22;23","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,"class":"mdui-radio","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},"style":{"left":"8px","top":"200px","width":"","height":""},"widgetSet":"jqui"},{"tpl":"tplJquiRadioList","data":{"oid":"javascript.0.heating.setTempAZ","g_fixed":true,"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,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","values":"17;18;19;20;21;22;23","texts":"17;18;19;20;21;22;23","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,"class":"mdui-radio","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},"style":{"left":"8px","top":"264px","width":"","height":""},"widgetSet":"jqui"},{"tpl":"tplJquiButtonDialogClose","data":{"g_fixed":true,"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,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","buttontext":"SCHLIESSEN","iconClass":"","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,"class":"mdui-flatbutton mdui-closebtn","dlgName":"","no_style":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},"style":{"left":"160px","top":"320px"},"widgetSet":"jqui"}]

                    So sieht der DIalog dann aus:
                     ![3336_sollwerte.png](/assets/uploads/files/3336_sollwerte.png) 
                    1 Reply Last reply Reply Quote 0
                    • P
                      ple last edited by

                      Genau sowas;-)

                      Ich habe auch eine Fb, aber die kann ich nicht einstellen, weil die Ventile immer offen sind und der Rest über den Vorlauf läuft.

                      Aber das Dialog brauch ich für die Jalousien und für Diagramme.

                      Nachher mal schauen ob ich das irgendwie hinkriege, da deine Card mit den float echt schick ist.

                      Wie sehen deine anderen views vom eg usw aus? Da könnte ich mir bestimmt noch was abgucken;-)

                      Melde mich heute Abend noch mal.

                      1 Reply Last reply Reply Quote 0
                      • P
                        ple last edited by

                        Hallo zusammen,

                        ich hätte da noch eine Frage, wo ich leider nicht weiterkomme.

                        Ich bräuchte einen Button, der mir true und false geben kann. Der Button müsste aber bei true rot werden und bei false grün.

                        Wenn er dann Rot ist wäre ein Blinkender Rahmen noch nice to have. 🙂

                        Quadratisch würde reichen.

                        Nach 2 Tagen suchen mit google bin ich wirklich nicht vorangekommen und der "hqwidget on off" ist nicht gerade schön und meine CSS Kenntnisse halten sich in Grenzen.

                        Gruß und Danke

                        1 Reply Last reply Reply Quote 0
                        • arteck
                          arteck Developer Most Active last edited by

                          installier https://github.com/DeepCoreSystem/iobroker.vis-deepcore mal

                          und http://forum.iobroker.net/viewtopic.php?t=3382 auch unaffindbar ???

                          1 Reply Last reply Reply Quote 0
                          • P
                            ple last edited by

                            Das habe ich beim besten willen nicht gefunden und google kann ich eigentlich bedienen.

                            Das passt jedoch sehr gut zu meiner Vis, die ich gerade neu erstelle.

                            Daher möchte ich euch meine ersten Gehversuche vorstellen. Ich hatte mit VIS vorher nicht viel am Hut und hatte mich recht schnell zurechtgefunden. Also ist das auch für Anfänger geeignet.

                            Danke Uhula für dein Material CSS und danke an MaikB85 für seine Bestellung seines Projektes. Da konnte man sich einiges noch abgucken.

                            So, die Screens zeigen das gleiche Projekt auf dem iPhone sowie auf dem Ipad. Im Moment sind nur Startseite und Wohnzimmer fertig. Der Rest ist copy paste und kommt die Tage. Dient erster Linie auch als Ersatz zu Mobileui. Ich finde sowas für Anfänger sehr gut, da in kurzer Zeit große Erfolge erzielt werden können.
                            1241_iphone_1.png
                            1241_iphone2.png
                            1241_iphone3.png
                            1241_iphone4.png
                            1241_iphone5.png
                            1241_ipad1.png
                            1241_ipad2.png
                            1241_ipad3.png
                            1241_ipad4.png

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

                              @ple:

                              Ich bräuchte einen Button, der mir true und false geben kann. Der Button müsste aber bei true rot werden und bei false grün. `
                              Dazu kannst du im Prinzip jedes basic/jqui Button-Widget verwenden, um deren Hintergrundfarbe zu ändern musst du lediglich in der CSS Eigenschaft etwas tricksen. Dir ist bekannt, dass man dort mit mdui-red-bg und mdui-green-bg die Hintergrundfarbe ändern kann. Das muss nun nur noch so erfasst werden, dass es von einem Object-State abhängig ist. Dazu bietet sich das ioBroker-Binding an. Angenommen dein true/false Object hat die ID javascript.0.myBool dann musst du in der CSS Eigenschaft des Widgest folgendes zusätzlich erfassen:

                              {v:javascript.0.myBool;v=='true'?'mdui-red-bg'::'mdui-green-bg'}

                              Falls es bei rot auch noch pulsieren soll:

                              {v:javascript.0.myBool;v=='true'?'mdui-red-bg mdui-red-pulse'::'mdui-green-bg'}

                              Hinweis: Das Binding wirkt sich nicht im Editor aus, sondern nur zur Laufzeit.

                              Viel Erfolg!

                              P.S.: Ein sehr gutes Ergebnis hast du da für einen Newcomer geschaffen. 😉

                              1 Reply Last reply Reply Quote 0
                              • P
                                PicNic last edited by

                                @ple:

                                So, die Screens zeigen das gleiche Projekt auf dem iPhone sowie auf dem Ipad. Im Moment sind nur Startseite und Wohnzimmer fertig. Der Rest ist copy paste und kommt die Tage. Dient erster Linie auch als Ersatz zu Mobileui. Ich finde sowas für Anfänger sehr gut, da in kurzer Zeit große Erfolge erzielt werden können. `

                                Hi ple,

                                das gefällt mir sehr gut! Vor allem das Widget "Energie". Magst du das zur verfügung stellen?

                                Danke und viele Grüße

                                Picnic

                                1 Reply Last reply Reply Quote 0
                                • P
                                  ple last edited by

                                  @PicNic:

                                  @ple:

                                  So, die Screens zeigen das gleiche Projekt auf dem iPhone sowie auf dem Ipad. Im Moment sind nur Startseite und Wohnzimmer fertig. Der Rest ist copy paste und kommt die Tage. Dient erster Linie auch als Ersatz zu Mobileui. Ich finde sowas für Anfänger sehr gut, da in kurzer Zeit große Erfolge erzielt werden können. `

                                  Hi ple,

                                  das gefällt mir sehr gut! Vor allem das Widget "Energie". Magst du das zur verfügung stellen?

                                  Danke und viele Grüße

                                  Picnic `

                                  Gerne doch. Werde aber demnächst mir mehr mit vertikalen Balken machen, denke das sieht noch besser aus.

                                  ! ````
                                  [{"tpl":"tplJustgageJustGage","data":{"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","is_tdp":false,"factor":"1","balance1":"50","balance2":"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,"oid":"","min_oid":0,"max_oid":"5000","unit":"W","color1":"#48db00","color2":"#ffc033","color3":"#c20000","gaugeWidthScale":"40","hideMinMax":true,"label_oid":"","title":"Heizung","titleBelow":false,"valueFontColor":"#828282"},"style":{"left":"962px","top":"351px","width":"200px","height":"125px"},"widgetSet":"justgage"},{"tpl":"tplJustgageJustGage","data":{"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","is_tdp":false,"factor":"1","balance1":"50","balance2":"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,"oid":"","min_oid":0,"max_oid":"5000","unit":"W","color1":"#48db00","color2":"#ffc033","color3":"#c20000","gaugeWidthScale":"40","hideMinMax":true,"label_oid":"","title":"Strom","titleBelow":false,"valueFontColor":"#828282"},"style":{"left":"793px","top":"351px","width":"200px","height":"125px"},"widgetSet":"justgage"},{"tpl":"tplContainerButtonDialog","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":false,"g_css_background":true,"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","buttontext":"Diagramm","padding":"5","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,"contains_view":"main_card_Energie_Diagramm","no_style":false,"dialog_top":"0","dialog_left":"0","html_prepend":"","dialog_width":"100%","dialog_height":"400","class":"mdui-flatbutton"},"style":{"left":"1001px","top":"572px","width":"auto","height":"auto","z-index":"10"},"widgetSet":"jqui"},{"tpl":"tplValueStringRaw","data":{"oid":"","g_fixed":true,"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","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,"html_prepend":"Monat: ","test_html":"23,2","html_append":" kWh","class":"mdui-text mdui-teal","max_oid":"4500"},"style":{"left":"1001px","top":"546px","width":"auto","height":"20px"},"widgetSet":"basic"},{"tpl":"tplValueStringRaw","data":{"oid":"","g_fixed":true,"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","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,"html_prepend":"Woche: ","test_html":"23,2","html_append":" kWh","class":"mdui-text mdui-teal","max_oid":"4500"},"style":{"left":"1001px","top":"520px","width":"auto","height":"20px"},"widgetSet":"basic"},{"tpl":"tplValueStringRaw","data":{"oid":"","g_fixed":true,"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","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,"html_prepend":"Gestern: ","test_html":"23,2","html_append":" kWh","class":"mdui-text mdui-teal","max_oid":"4500"},"style":{"left":"1001px","top":"494px","width":"auto","height":"20px"},"widgetSet":"basic"},{"tpl":"tplValueStringRaw","data":{"oid":"","g_fixed":true,"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","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,"html_prepend":"Heute: ","test_html":"23,2","html_append":" kWh","class":"mdui-value mdui-green","max_oid":"4500"},"style":{"left":"1001px","top":"468px","width":"auto","height":"20px","z-index":"10"},"widgetSet":"basic"},{"tpl":"tplValueStringRaw","data":{"oid":"","g_fixed":true,"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","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,"html_prepend":"Monat: ","test_html":"23,2","html_append":" kWh","class":"mdui-text mdui-teal","max_oid":"4500"},"style":{"left":"832px","top":"546px","width":"auto","height":"20px"},"widgetSet":"basic"},{"tpl":"tplValueStringRaw","data":{"oid":"","g_fixed":true,"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","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,"html_prepend":"Woche: ","test_html":"23,2","html_append":" kWh","class":"mdui-text mdui-teal","max_oid":"4500"},"style":{"left":"832px","top":"520px","width":"auto","height":"20px"},"widgetSet":"basic"},{"tpl":"tplValueStringRaw","data":{"oid":"","g_fixed":true,"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","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,"html_prepend":"Gestern: ","test_html":"23,2","html_append":" kWh","class":"mdui-text mdui-teal","max_oid":"4500"},"style":{"left":"832px","top":"494px","width":"auto","height":"20px"},"widgetSet":"basic"},{"tpl":"tplContainerButtonDialog","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":false,"g_css_background":true,"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","buttontext":"Diagramm","padding":"5","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,"contains_view":"main_card_Energie_Diagramm","no_style":false,"dialog_top":"0","dialog_left":"0","html_prepend":"","dialog_width":"100%","dialog_height":"400","class":"mdui-flatbutton"},"style":{"left":"832px","top":"572px","width":"auto","height":"auto","z-index":"10"},"widgetSet":"jqui"},{"tpl":"tplValueStringRaw","data":{"oid":"","g_fixed":true,"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","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,"html_prepend":"Heute: ","test_html":"23,2","html_append":" kWh","class":"mdui-value mdui-green","max_oid":"4500"},"style":{"left":"832px","top":"468px","width":"auto","height":"20px","z-index":"10"},"widgetSet":"basic"}]

                                  
                                  Bezüglich des buttons und Hintergrund. ich habe mal mit einem Standart Button rumgespielt, welches bereits CSS Klassen mit sich bringt.
                                  
                                  Das konnte ich dann mit Codeschnippels manipulieren.
                                  
                                  Die Tage mal schauen, was ich noch so an Bildern für Vorlagen die ich dann nachbauen kann.
                                  
                                  Gruß und vielen Dank für das tolle Projekt.
                                  1 Reply Last reply Reply Quote 0
                                  • arteck
                                    arteck Developer Most Active last edited by

                                    @ple:

                                    @PicNic:

                                    @ple:

                                    So, die Screens zeigen das gleiche Projekt auf dem iPhone sowie auf dem Ipad. Im Moment sind nur Startseite und Wohnzimmer fertig. Der Rest ist copy paste und kommt die Tage. Dient erster Linie auch als Ersatz zu Mobileui. Ich finde sowas für Anfänger sehr gut, da in kurzer Zeit große Erfolge erzielt werden können. `

                                    Hi ple,

                                    das gefällt mir sehr gut! Vor allem das Widget "Energie". Magst du das zur verfügung stellen?

                                    Danke und viele Grüße

                                    Picnic `

                                    Gerne doch. Werde aber demnächst mir mehr mit vertikalen Balken machen, denke das sieht noch besser aus.

                                    ! ````
                                    [{"tpl":"tplJustgageJustGage","data":{"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","is_tdp":false,"factor":"1","balance1":"50","balance2":"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,"oid":"","min_oid":0,"max_oid":"5000","unit":"W","color1":"#48db00","color2":"#ffc033","color3":"#c20000","gaugeWidthScale":"40","hideMinMax":true,"label_oid":"","title":"Heizung","titleBelow":false,"valueFontColor":"#828282"},"style":{"left":"962px","top":"351px","width":"200px","height":"125px"},"widgetSet":"justgage"},{"tpl":"tplJustgageJustGage","data":{"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","is_tdp":false,"factor":"1","balance1":"50","balance2":"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,"oid":"","min_oid":0,"max_oid":"5000","unit":"W","color1":"#48db00","color2":"#ffc033","color3":"#c20000","gaugeWidthScale":"40","hideMinMax":true,"label_oid":"","title":"Strom","titleBelow":false,"valueFontColor":"#828282"},"style":{"left":"793px","top":"351px","width":"200px","height":"125px"},"widgetSet":"justgage"},{"tpl":"tplContainerButtonDialog","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":false,"g_css_background":true,"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","buttontext":"Diagramm","padding":"5","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,"contains_view":"main_card_Energie_Diagramm","no_style":false,"dialog_top":"0","dialog_left":"0","html_prepend":"","dialog_width":"100%","dialog_height":"400","class":"mdui-flatbutton"},"style":{"left":"1001px","top":"572px","width":"auto","height":"auto","z-index":"10"},"widgetSet":"jqui"},{"tpl":"tplValueStringRaw","data":{"oid":"","g_fixed":true,"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","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,"html_prepend":"Monat: ","test_html":"23,2","html_append":" kWh","class":"mdui-text mdui-teal","max_oid":"4500"},"style":{"left":"1001px","top":"546px","width":"auto","height":"20px"},"widgetSet":"basic"},{"tpl":"tplValueStringRaw","data":{"oid":"","g_fixed":true,"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","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,"html_prepend":"Woche: ","test_html":"23,2","html_append":" kWh","class":"mdui-text mdui-teal","max_oid":"4500"},"style":{"left":"1001px","top":"520px","width":"auto","height":"20px"},"widgetSet":"basic"},{"tpl":"tplValueStringRaw","data":{"oid":"","g_fixed":true,"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","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,"html_prepend":"Gestern: ","test_html":"23,2","html_append":" kWh","class":"mdui-text mdui-teal","max_oid":"4500"},"style":{"left":"1001px","top":"494px","width":"auto","height":"20px"},"widgetSet":"basic"},{"tpl":"tplValueStringRaw","data":{"oid":"","g_fixed":true,"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","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,"html_prepend":"Heute: ","test_html":"23,2","html_append":" kWh","class":"mdui-value mdui-green","max_oid":"4500"},"style":{"left":"1001px","top":"468px","width":"auto","height":"20px","z-index":"10"},"widgetSet":"basic"},{"tpl":"tplValueStringRaw","data":{"oid":"","g_fixed":true,"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","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,"html_prepend":"Monat: ","test_html":"23,2","html_append":" kWh","class":"mdui-text mdui-teal","max_oid":"4500"},"style":{"left":"832px","top":"546px","width":"auto","height":"20px"},"widgetSet":"basic"},{"tpl":"tplValueStringRaw","data":{"oid":"","g_fixed":true,"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","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,"html_prepend":"Woche: ","test_html":"23,2","html_append":" kWh","class":"mdui-text mdui-teal","max_oid":"4500"},"style":{"left":"832px","top":"520px","width":"auto","height":"20px"},"widgetSet":"basic"},{"tpl":"tplValueStringRaw","data":{"oid":"","g_fixed":true,"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","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,"html_prepend":"Gestern: ","test_html":"23,2","html_append":" kWh","class":"mdui-text mdui-teal","max_oid":"4500"},"style":{"left":"832px","top":"494px","width":"auto","height":"20px"},"widgetSet":"basic"},{"tpl":"tplContainerButtonDialog","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":false,"g_css_background":true,"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","buttontext":"Diagramm","padding":"5","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,"contains_view":"main_card_Energie_Diagramm","no_style":false,"dialog_top":"0","dialog_left":"0","html_prepend":"","dialog_width":"100%","dialog_height":"400","class":"mdui-flatbutton"},"style":{"left":"832px","top":"572px","width":"auto","height":"auto","z-index":"10"},"widgetSet":"jqui"},{"tpl":"tplValueStringRaw","data":{"oid":"","g_fixed":true,"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","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,"html_prepend":"Heute: ","test_html":"23,2","html_append":" kWh","class":"mdui-value mdui-green","max_oid":"4500"},"style":{"left":"832px","top":"468px","width":"auto","height":"20px","z-index":"10"},"widgetSet":"basic"}]

                                    
                                    Bezüglich des buttons und Hintergrund. ich habe mal mit einem Standart Button rumgespielt, welches bereits CSS Klassen mit sich bringt.
                                    
                                    Das konnte ich dann mit Codeschnippels manipulieren.
                                    
                                    Die Tage mal schauen, was ich noch so an Bildern für Vorlagen die ich dann nachbauen kann.
                                    
                                    Gruß und vielen Dank für das tolle Projekt. `  
                                    

                                    ich hätte interesse an Energieverlauf 8-) 8-)

                                    1 Reply Last reply Reply Quote 0
                                    • P
                                      ple last edited by

                                      Klar doch, ist jedoch noch nicht fertig.

                                      Was habt ihr so umgesetzt? Screens würden erst mal reichen, damit ich ein paar Ideen übernehmen kann.

                                      ! ````
                                      {
                                      "settings": {
                                      "style": {
                                      "background_class": ""
                                      },
                                      "theme": "redmond",
                                      "sizex": "",
                                      "sizey": "",
                                      "gridSize": "13",
                                      "class": "",
                                      "snapType": 2,
                                      "useBackground": false
                                      },
                                      "widgets": {
                                      "e00001": {
                                      "tpl": "tplHtml",
                                      "data": {
                                      "g_fixed": true,
                                      "g_visibility": false,
                                      "g_css_font_text": true,
                                      "g_css_background": true,
                                      "g_css_shadow_padding": false,
                                      "g_css_border": false,
                                      "g_gestures": false,
                                      "g_signals": false,
                                      "visibility-cond": "==",
                                      "visibility-val": 1,
                                      "visibility-groups-action": "hide",
                                      "refreshInterval": "0",
                                      "signals-cond-0": "==",
                                      "signals-val-0": true,
                                      "signals-icon-0": "/vis.0/test/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.0/test/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.0/test/lowbattery.png",
                                      "signals-icon-size-2": 0,
                                      "signals-blink-2": false,
                                      "signals-horz-2": 0,
                                      "signals-vert-2": 0,
                                      "signals-hide-edit-2": false,
                                      "class": "mdui-timespan-60 mdui-target-w00302 mdui-hide",
                                      "html": "1S",
                                      "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
                                      },
                                      "style": {
                                      "left": "13px",
                                      "top": "197px",
                                      "width": "52px",
                                      "height": "52px",
                                      "text-align": "center",
                                      "cursor": "pointer",
                                      "line-height": "3em",
                                      "z-index": "",
                                      "font-weight": "",
                                      "font-size": "",
                                      "color": "#ffffff",
                                      "opacity": "",
                                      "background": "rgba(0,0,0,0.5)"
                                      },
                                      "widgetSet": "basic"
                                      },
                                      "e00002": {
                                      "tpl": "tplHtml",
                                      "data": {
                                      "g_fixed": true,
                                      "g_visibility": false,
                                      "g_css_font_text": true,
                                      "g_css_background": true,
                                      "g_css_shadow_padding": false,
                                      "g_css_border": false,
                                      "g_gestures": false,
                                      "g_signals": false,
                                      "visibility-cond": "==",
                                      "visibility-val": 1,
                                      "visibility-groups-action": "hide",
                                      "refreshInterval": "0",
                                      "signals-cond-0": "==",
                                      "signals-val-0": true,
                                      "signals-icon-0": "/vis.0/test/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.0/test/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.0/test/lowbattery.png",
                                      "signals-icon-size-2": 0,
                                      "signals-blink-2": false,
                                      "signals-horz-2": 0,
                                      "signals-vert-2": 0,
                                      "signals-hide-edit-2": false,
                                      "class": "mdui-timespan-10080 mdui-target-w00302 mdui-hide",
                                      "html": "1W",
                                      "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
                                      },
                                      "style": {
                                      "left": "13px",
                                      "top": "301px",
                                      "width": "52px",
                                      "height": "52px",
                                      "text-align": "center",
                                      "cursor": "pointer",
                                      "line-height": "3em",
                                      "z-index": "",
                                      "font-weight": "",
                                      "font-size": "",
                                      "color": "#ffffff",
                                      "opacity": "",
                                      "background": "rgba(0,0,0,0.5)"
                                      },
                                      "widgetSet": "basic"
                                      },
                                      "e00003": {
                                      "tpl": "tplHtml",
                                      "data": {
                                      "g_fixed": true,
                                      "g_visibility": false,
                                      "g_css_font_text": true,
                                      "g_css_background": true,
                                      "g_css_shadow_padding": false,
                                      "g_css_border": false,
                                      "g_gestures": false,
                                      "g_signals": false,
                                      "visibility-cond": "==",
                                      "visibility-val": 1,
                                      "visibility-groups-action": "hide",
                                      "refreshInterval": "0",
                                      "signals-cond-0": "==",
                                      "signals-val-0": true,
                                      "signals-icon-0": "/vis.0/test/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.0/test/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.0/test/lowbattery.png",
                                      "signals-icon-size-2": 0,
                                      "signals-blink-2": false,
                                      "signals-horz-2": 0,
                                      "signals-vert-2": 0,
                                      "signals-hide-edit-2": false,
                                      "class": "mdui-timespan-1440 mdui-target-w00302 mdui-hide",
                                      "html": "1T",
                                      "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
                                      },
                                      "style": {
                                      "left": "13px",
                                      "top": "249px",
                                      "width": "52px",
                                      "height": "52px",
                                      "text-align": "center",
                                      "cursor": "pointer",
                                      "line-height": "3em",
                                      "z-index": "",
                                      "font-weight": "",
                                      "font-size": "",
                                      "color": "#ffffff",
                                      "opacity": "",
                                      "background": "rgba(0,0,0,0.5)"
                                      },
                                      "widgetSet": "basic"
                                      },
                                      "e00004": {
                                      "tpl": "tplIFrame",
                                      "data": {
                                      "g_fixed": true,
                                      "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,
                                      "visibility-cond": "==",
                                      "visibility-val": 1,
                                      "visibility-groups-action": "hide",
                                      "refreshInterval": "0",
                                      "refreshOnWakeUp": "false",
                                      "refreshOnViewChange": "false",
                                      "scrollX": "false",
                                      "scrollY": "false",
                                      "seamless": "true",
                                      "signals-cond-0": "==",
                                      "signals-val-0": true,
                                      "signals-icon-0": "/vis.0/test/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.0/test/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.0/test/lowbattery.png",
                                      "signals-icon-size-2": 0,
                                      "signals-blink-2": false,
                                      "signals-horz-2": 0,
                                      "signals-vert-2": 0,
                                      "signals-hide-edit-2": false,
                                      "src": "http://192.168.10.11:8082/flot/index.html?l[0][id]=hm-rpc.0.ABC66418.1.POWER&l[0][instance]=history.0&l[0][offset]=0&l[0][aggregate]=minmax&l[0][color]=%23fff55e&l[0][min]=50&l[0][thickness]=3&l[0][shadowsize]=3&l[0][unit]=W&l[0][name]=W+Leistung&l[0][points]=false&l[0][chartType]=line&l[0][afterComma]=0&l[0][xaxe]=bottom&l[0][yaxe]=rightColor&l[0][yticks]=10&l[0][fill]=0.4&l[0][ignoreNull]=&l[1][id]=javascript.0.BSZ.Counter.Strom.DELTA.Strom-kWh.1-DAY&l[1][instance]=history.0&l[1][offset]=0&l[1][aggregate]=minmax&l[1][color]=%23ff000b&l[1][min]=0&l[1][thickness]=3&l[1][shadowsize]=3&l[1][unit]=kWh&l[1][name]=kWh+Verbrauch&l[1][yaxe]=rightColor&l[1][points]=false&l[1][xaxe]=off&timeType=relative&relativeEnd=now&range=1440&aggregateType=count&aggregateSpan=300&noBorder=noborder&x_labels_color=%23ffffff&grid_color=%23ffffff&legend=sw&legColumns=0&hoverDetail=true&timeFormat=%H%3A%M&useComma=false&zoom=false&noedit=true&animation=0",
                                      "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
                                      },
                                      "style": {
                                      "left": "58px",
                                      "top": "52px",
                                      "width": "calc(100% - 50px)",
                                      "height": "calc(100% - 65px)",
                                      "z-index": ""
                                      },
                                      "widgetSet": "basic"
                                      },
                                      "e00005": {
                                      "tpl": "tplHtml",
                                      "data": {
                                      "g_fixed": true,
                                      "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,
                                      "visibility-cond": "==",
                                      "visibility-val": 1,
                                      "visibility-groups-action": "hide",
                                      "refreshInterval": "0",
                                      "signals-cond-0": "==",
                                      "signals-val-0": true,
                                      "signals-icon-0": "/vis.0/test/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.0/test/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.0/test/lowbattery.png",
                                      "signals-icon-size-2": 0,
                                      "signals-blink-2": false,
                                      "signals-horz-2": 0,
                                      "signals-vert-2": 0,
                                      "signals-hide-edit-2": false,
                                      "html": "",
                                      "class": "mdui-flatbutton mdui-toggle mdui-target-w00302 ",
                                      "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
                                      },
                                      "style": {
                                      "left": "13px",
                                      "top": "41px",
                                      "width": "52px",
                                      "height": "52px"
                                      },
                                      "widgetSet": "basic"
                                      },
                                      "e00006": {
                                      "tpl": "tplHtml",
                                      "data": {
                                      "g_fixed": true,
                                      "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,
                                      "visibility-cond": "==",
                                      "visibility-val": 1,
                                      "visibility-groups-action": "hide",
                                      "refreshInterval": "0",
                                      "signals-cond-0": "==",
                                      "signals-val-0": true,
                                      "signals-icon-0": "/vis.0/test/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.0/test/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.0/test/lowbattery.png",
                                      "signals-icon-size-2": 0,
                                      "signals-blink-2": false,
                                      "signals-horz-2": 0,
                                      "signals-vert-2": 0,
                                      "signals-hide-edit-2": false,
                                      "html": "",
                                      "class": "mdui-flatbutton mdui-fullscreen ",
                                      "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
                                      },
                                      "style": {
                                      "left": "calc(100% - 65px)",
                                      "top": "-4px",
                                      "width": "52px",
                                      "height": "52px",
                                      "z-index": "5"
                                      },
                                      "widgetSet": "basic"
                                      },
                                      "e00007": {
                                      "tpl": "tplHtml",
                                      "data": {
                                      "g_fixed": true,
                                      "g_visibility": false,
                                      "g_css_font_text": false,
                                      "g_css_background": true,
                                      "g_css_shadow_padding": false,
                                      "g_css_border": false,
                                      "g_gestures": false,
                                      "g_signals": false,
                                      "visibility-cond": "==",
                                      "visibility-val": 1,
                                      "visibility-groups-action": "hide",
                                      "refreshInterval": "0",
                                      "signals-cond-0": "==",
                                      "signals-val-0": true,
                                      "signals-icon-0": "/vis.0/test/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.0/test/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.0/test/lowbattery.png",
                                      "signals-icon-size-2": 0,
                                      "signals-blink-2": false,
                                      "signals-horz-2": 0,
                                      "signals-vert-2": 0,
                                      "signals-hide-edit-2": false,
                                      "html": "",
                                      "class": "mdui-timespan-dec mdui-target-w00302 mdui-hide",
                                      "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
                                      },
                                      "style": {
                                      "left": "13px",
                                      "top": "93px",
                                      "width": "52px",
                                      "height": "52px",
                                      "background": "rgba(0,0,0,0.5)",
                                      "z-index": ""
                                      },
                                      "widgetSet": "basic"
                                      },
                                      "e00008": {
                                      "tpl": "tplHtml",
                                      "data": {
                                      "g_fixed": true,
                                      "g_visibility": false,
                                      "g_css_font_text": false,
                                      "g_css_background": true,
                                      "g_css_shadow_padding": false,
                                      "g_css_border": false,
                                      "g_gestures": false,
                                      "g_signals": false,
                                      "visibility-cond": "==",
                                      "visibility-val": 1,
                                      "visibility-groups-action": "hide",
                                      "refreshInterval": "0",
                                      "signals-cond-0": "==",
                                      "signals-val-0": true,
                                      "signals-icon-0": "/vis.0/test/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.0/test/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.0/test/lowbattery.png",
                                      "signals-icon-size-2": 0,
                                      "signals-blink-2": false,
                                      "signals-horz-2": 0,
                                      "signals-vert-2": 0,
                                      "signals-hide-edit-2": false,
                                      "html": "",
                                      "class": "mdui-timespan-inc mdui-target-w00302 mdui-hide",
                                      "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
                                      },
                                      "style": {
                                      "left": "13px",
                                      "top": "145px",
                                      "width": "52px",
                                      "height": "52px",
                                      "background": "rgba(0,0,0,0.5)",
                                      "z-index": ""
                                      },
                                      "widgetSet": "basic"
                                      },
                                      "e00009": {
                                      "tpl": "tplHtml",
                                      "data": {
                                      "g_fixed": true,
                                      "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,
                                      "visibility-cond": "==",
                                      "visibility-val": 1,
                                      "visibility-groups-action": "hide",
                                      "refreshInterval": "0",
                                      "signals-cond-0": "==",
                                      "signals-val-0": true,
                                      "signals-icon-0": "/vis.0/test/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.0/test/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.0/test/lowbattery.png",
                                      "signals-icon-size-2": 0,
                                      "signals-blink-2": false,
                                      "signals-horz-2": 0,
                                      "signals-vert-2": 0,
                                      "signals-hide-edit-2": false,
                                      "html": "",
                                      "class": "mdui-abar mdui-grey-bg",
                                      "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,
                                      "comment": "",
                                      "name": "app-bar"
                                      },
                                      "style": {
                                      "left": "0px",
                                      "top": "0px",
                                      "width": "100%",
                                      "height": "42px",
                                      "z-index": "0",
                                      "color": "#ffffff",
                                      "text-align": "center"
                                      },
                                      "widgetSet": "basic"
                                      },
                                      "e00010": {
                                      "tpl": "tplHtml",
                                      "data": {
                                      "g_fixed": true,
                                      "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,
                                      "visibility-cond": "==",
                                      "visibility-val": 1,
                                      "visibility-groups-action": "hide",
                                      "refreshInterval": "0",
                                      "signals-cond-0": "==",
                                      "signals-val-0": true,
                                      "signals-icon-0": "/vis.0/test/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.0/test/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.0/test/lowbattery.png",
                                      "signals-icon-size-2": 0,
                                      "signals-blink-2": false,
                                      "signals-horz-2": 0,
                                      "signals-vert-2": 0,
                                      "signals-hide-edit-2": false,
                                      "html": "Energieverlauf",
                                      "class": "mdui-title",
                                      "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
                                      },
                                      "style": {
                                      "left": "13px",
                                      "top": "13px",
                                      "width": "auto",
                                      "height": "auto",
                                      "z-index": 2
                                      },
                                      "widgetSet": "basic"
                                      },
                                      "e00011": {
                                      "tpl": "tplJquiButtonDialogClose",
                                      "data": {
                                      "g_fixed": true,
                                      "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,
                                      "visibility-cond": "==",
                                      "visibility-val": 1,
                                      "visibility-groups-action": "hide",
                                      "buttontext": "SCHLIESSEN",
                                      "iconClass": "",
                                      "signals-cond-0": "==",
                                      "signals-val-0": true,
                                      "signals-icon-0": "/vis.0/test/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.0/test/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.0/test/lowbattery.png",
                                      "signals-icon-size-2": 0,
                                      "signals-blink-2": false,
                                      "signals-horz-2": 0,
                                      "signals-vert-2": 0,
                                      "signals-hide-edit-2": false,
                                      "class": "mdui-flatbutton mdui-closebtn",
                                      "dlgName": "",
                                      "no_style": 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
                                      },
                                      "style": {
                                      "left": "calc(100% - 150px)",
                                      "top": "calc(100% - 40px)",
                                      "width": "120px",
                                      "height": "31px"
                                      },
                                      "widgetSet": "jqui"
                                      }
                                      },
                                      "name": "main_card_Energie_Diagramm",
                                      "filterList": []
                                      }

                                      1 Reply Last reply Reply Quote 0
                                      • P
                                        PicNic last edited by

                                        @ple:

                                        Gerne doch. Werde aber demnächst mir mehr mit vertikalen Balken machen, denke das sieht noch besser aus. `
                                        Danke 🙂

                                        1 Reply Last reply Reply Quote 0
                                        • E
                                          eXTreMe last edited by

                                          Ich würde gerne einzelne Teile dieses Designs (z.B. die weißen Switches & Slider) in meine Views übernehmen.

                                          Kann mir jemand sagen wie ich das anstelle? Was muss ich alles "kopieren" ?

                                          1 Reply Last reply Reply Quote 0
                                          • P
                                            ple last edited by

                                            Also ich kann dir sagen wie ich vorgegangen bin.

                                            Ich habe mir jeweils die Demo und Simple geladen und importiert. Die habe ich jedoch nicht verändert.

                                            Dann habe ich mir noch mal die Simple importiert und meinen Namen dafür vergeben.

                                            Danach habe ich mir die Cards angesehen und jeweils welche erstellt für Jalousien, Steckdosen, Licht usw.

                                            In der Simple sind jedoch nicht alle Material CSS Feature drin, daher gehe ich dann in das Projekt Demo und exportiere mir widgets die ich haben möchte und importiere

                                            die in meinen Projekt 🙂

                                            Funktioniert super so.

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

                                            Support us

                                            ioBroker
                                            Community Adapters
                                            Donate

                                            844
                                            Online

                                            31.9k
                                            Users

                                            80.1k
                                            Topics

                                            1.3m
                                            Posts

                                            111
                                            650
                                            189240
                                            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