Test Adapter Material Design Widgets v0.1.x

sigi234

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

Hab der table jetzt noch eine sortierfunktion beim anklicken der Spalte verpasst.

Es gibt eine weitere Option 'sortKey'. Damit ist es möglich einer Spalte eine andere Property der Objekte des Arrays zum sortieren zu zuweisen. Ah ja du Nerd

Ok machen wir das an einem Beispiel. Nehmen wir die oben dargestellte Spalte 'Betriebszeit'. Die Betriebszeit wird hier als gut lesbare Zeichenkette dargestellt. Würde man jetzt nach dieser sortieren (auf- bzw. absteigend), dann wäre die reihenfolge falsch und nicht korrekt nach Betriebszeit sortiert, da es eine Zeichenkette ist.
Deshalb kann man z.B. noch eine versteckte Spalte einfügen mit der Betriebszeit z.B. in Sekunden, nennen wir diese mal 'onTime'. Nun kann man in der dargestellten Spalte Betriebszeit im Feld 'sortKey' 'onTime' eintragen und schon wird alles richtig sortiert.

Schaut Euch das Beispiel Widget an, da ist das implemnetiert:

[{"tpl":"tplVis-materialdesign-Table","data":{"oid":"","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","countCols":"6","tableLayout":"card","showHeader":true,"headerTextSize":"15","textAlign0":"left","textAlign1":"left","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,"label0":"Erlebnis","label1":"Name","textAlign2":"right","label2":"Betriebszeit","textAlign3":"right","label3":"Betriebszeit","textSize0":"12","textSize1":"20","textSize2":"15","textSize3":"11","rowHeight":"27","padding_left1":"0","padding_left2":"0","padding_left3":"0","padding_right0":"0","padding_right1":"0","padding_right2":"","padding_right3":"","textAlign4":"center","padding_left4":"0","padding_right4":"0","label4":" ","headerRowHeight":"1","showColumn0":true,"showColumn1":true,"showColumn2":"true","showColumn3":false,"fontFamily0":"RobotoCondensed-Regular","fontFamily1":"RobotoCondensed-Regular","fontFamily2":"RobotoCondensed-Regular","fontFamily3":"RobotoCondensed-Regular","colorHeaderRowBackground":"#44739e","colorHeaderRowText":"#ffffff","headerFontFamily":"RobotoCondensed-Regular","textColor0":"","textColor1":"#44739e","colType0":"image","colType1":"text","colType2":"text","colType3":"text","imageHeight0":"33","prefix0":"<div style=\"height: 100%;\">\n    <span style=\"position: relative; top: -4px; left: 10px; font-family: RobotoCondensed-LightItalic\">#[obj.funk]</span>","suffix0":"</div>","padding_left0":"4","prefix1":"<a href=\"http://#[obj.ip]\" target=\"_blank\" style=\"text-decoration:none\">\n    <font color=\"#44739e\">","suffix1":"<font></a>","showColumn4":false,"colType4":"text","dataJson":"[\n{\"img\":\"/vis.0/myImages/erlebnis_50.png\",\"name\":\"Empire\",\"betriebszeit\":\"4h 06m\",\"funk\":\"5G\",\"ip\":\"10.0.0.1\", \"erlebnis\": \"42\", \"onTime\": 14760},\n{\"img\":\"/vis.0/myImages/erlebnis_100.png\",\"name\":\"Handy\",\"betriebszeit\":\"13m\",\"funk\":\"5G\",\"ip\":\"10.0.0.2\", \"erlebnis\": \"77\", \"onTime\": 780},\n{\"img\":\"/vis.0/myImages/erlebnis_100.png\",\"name\":\"Harmony Hub - Wohnzimmer\",\"betriebszeit\":\"18T 07h 21m\",\"funk\":\"2G\",\"ip\":\"10.0.0.3\", \"erlebnis\": \"87\", \"onTime\": 1580421},\n{\"img\":\"/vis.0/myImages/erlebnis_25.png\",\"name\":\"MusicCast - Esszimmer (WX-030)\",\"betriebszeit\":\"1h 57m\",\"funk\":\"2G\",\"ip\":\"10.0.0.4\", \"erlebnis\": \"10\", \"onTime\": 7020},\n{\"img\":\"/vis.0/myImages/erlebnis_75.png\",\"name\":\"MusicCast - Küche (ISX-18D)\",\"betriebszeit\":\"4h 10m\",\"funk\":\"2G\",\"ip\":\"10.0.0.5\", \"erlebnis\": \"60\", \"onTime\": 15000}\n]","sortKey0":"erlebnis","showColumn5":false,"colType5":"text","textAlign5":"center","showColumn6":false,"colType6":"text","textAlign6":"center","sortKey2":"onTime"},"style":{"left":"748px","top":"16px","width":"542px","height":"326px","overflow-y":""},"widgetSet":"materialdesign"}]

Hallo, also das ist ja nur wenn ich eine Fixe Tabelle einfügen will, die Daten aktualisieren sich ja nicht automatisch.
Oder sehe ich da was Falsch?

Scrounger

@Negalein sagte in Test Adapter Material Design Widgets v0.1.x:

2.) Und ist es Möglich, den Text der Subitems rechtsbündig anzuordnen?
{"itemText": "Alexa", "subItems": ["Wohnzimmer", "Schlafzimmer", "Küche", "Kinderzimmer"]}

Habs grad eingebaut, kann jetzt für die Items und SubItems eingestellt werden per VisEditor.
Positiver Nebeneffekt, bei den Listen Widgets muss ich es jetzt auch noch einbauen

@sigi234 sagte in Test Adapter Material Design Widgets v0.1.x:

Hallo, also das ist ja nur wenn ich eine Fixe Tabelle einfügen will, die Daten aktualisieren sich ja nicht automatisch.
Oder sehe ich da was Falsch?

Ja siehst du falsch, geht auch wenn du die Daten per Datenpunkt an die Tabelle übergibst.

sigi234

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

Ja siehst du falsch, geht auch wenn du die Daten per Datenpunkt an die Tabelle übergibst.

Und wie? Kannst du mir bitte ein Beispiel machen irgendwo habe ich immer einen Fehler:

DP:
daswetter.0.NextHours.Location_1.Day_1.current.clouds_value

Negalein

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

@Negalein sagte in Test Adapter Material Design Widgets v0.1.x:

2.) Und ist es Möglich, den Text der Subitems rechtsbündig anzuordnen?
{"itemText": "Alexa", "subItems": ["Wohnzimmer", "Schlafzimmer", "Küche", "Kinderzimmer"]}

Habs grad eingebaut, kann jetzt für die Items und SubItems eingestellt werden per VisEditor.
Positiver Nebeneffekt, bei den Listen Widgets muss ich es jetzt auch noch einbauen

Danke

Allerdings scheint es nicht zu klappen, oder ich hab es falsch eingestellt.
Submenü bleibt leider zentriert.

vis (3).png
Edit vis (12).png

sigi234

@Negalein sagte in Test Adapter Material Design Widgets v0.1.x:

Allerdings scheint es nicht zu klappen, oder ich hab es falsch eingestellt.
Submenü bleibt leider zentriert.

Screenshot (603)_LI.jpg

Scrounger

@sigi234 sagte in Test Adapter Material Design Widgets v0.1.x:

Und wie? Kannst du mir bitte ein Beispiel machen irgendwo habe ich immer einen Fehler:

DP:
daswetter.0.NextHours.Location_1.Day_1.current.clouds_value

Poste mal die Value des Datenpunktes.

Negalein

@sigi234 sagte in Test Adapter Material Design Widgets v0.1.x:

Danke, funktioniert!

sigi234

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

@sigi234 sagte in Test Adapter Material Design Widgets v0.1.x:

Und wie? Kannst du mir bitte ein Beispiel machen irgendwo habe ich immer einen Fehler:

DP:
daswetter.0.NextHours.Location_1.Day_1.current.clouds_value

Poste mal die Value des Datenpunktes.

53 %

{
  "from": "system.adapter.daswetter.0",
  "ts": 1544353203713,
  "user": "system.user.admin",
  "common": {
    "name": "clouds",
    "type": "string",
    "role": "weather.clouds.forecast.0",
    "unit": "%",
    "read": true,
    "write": false,
    "custom": {
      "history.0": {
        "enabled": true,
        "changesOnly": true,
        "debounce": "1000",
        "maxLength": "10",
        "retention": "31536000",
        "changesRelogInterval": 5,
        "changesMinDelta": 0,
        "aliasId": ""
      },
      "iqontrol.0": {
        "enabled": true,
        "readonly": true,
        "invert": false,
        "unit": "%",
        "type": "number",
        "role": "state",
        "targetValueId": "",
        "confirm": false,
        "pincode": "",
        "unit_zero": "",
        "unit_one": "",
        "min": "",
        "max": "",
        "step": ""
      }
    }
  },
  "native": {},
  "acl": {
    "object": 1636,
    "owner": "system.user.admin",
    "ownerGroup": "system.group.administrator",
    "state": 1636
  },
  "_id": "daswetter.0.NextHours.Location_1.Day_1.current.clouds_value",
  "type": "state"
}

Scrounger

@sigi234

Brauch den Wert des Datenpunktes.
Was genau funktioniert denn nicht?

sigi234

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

Brauch den Wert des Datenpunktes.

Screenshot (605).png

Scrounger

@sigi234 sagte in Test Adapter Material Design Widgets v0.1.x:

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

Brauch den Wert des Datenpunktes.

Das kann ja auch nicht gehen. Der datenpunkt muss z.B. folgendes Format haben:

[
{"img":"/vis.0/myImages/erlebnis_50.png","name":"Empire","betriebszeit":"4h 06m","funk":"5G","ip":"10.0.0.1"},
{"img":"/vis.0/myImages/erlebnis_100.png","name":"Handy","betriebszeit":"13m","funk":"5G","ip":"10.0.0.2"},
{"img":"/vis.0/myImages/erlebnis_100.png","name":"Harmony Hub - Wohnzimmer","betriebszeit":"18T 07h 21m","funk":"2G","ip":"10.0.0.3"},
{"img":"/vis.0/myImages/erlebnis_25.png","name":"MusicCast - Esszimmer (WX-030)","betriebszeit":"1h 57m","funk":"2G","ip":"10.0.0.4"},
{"img":"/vis.0/myImages/erlebnis_75.png","name":"MusicCast - Küche (ISX-18D)","betriebszeit":"4h 10m","funk":"2G","ip":"10.0.0.5"}
]

Am besten schreibst du dir ein kleines skript mit dem du alle Werte, die du in der Tabelle haben möchtest, in das oben dargestellte format bringst.

tazdevil20

Habe eine Frage zu der Value Select List:

In dem Objekt "Schalter" wird doch sicherlich hinterlegt welche Auswahl getroffen wurde. Wie muss ich hier die Einstellung vornehmen, oder ist das noch soweit Beta, dass noch keine Funktionalität hinterlegt ist? Habe alles schon ausprobiert, jedoch wurde nie ein Wert eingetragen.

Jetzt der Feature requests:

Besteht die Möglichkeit die Werte variable mittels JSON bereitzustellen?
Ich würde den Button auch gerne etwas von der Höhe her verkleinern.
Die Auswahlliste breiter darstellen als der Button.

Scrounger

@tazdevil20 sagte in Test Adapter Material Design Widgets v0.1.x:

Wie muss ich hier die Einstellung vornehmen

Funktioniert. Mustt hier die Werte Eintragen die der Datenpunkt (Schalter) annehmen soll:

Jetzt der Feature requests:

Besteht die Möglichkeit die Werte variable mittels JSON bereitzustellen?

Nein.

Ich würde den Button auch gerne etwas von der Höhe her verkleinern.

Die Auswahlliste breiter darstellen als der Button.

Geht mit css überschreiben

acramatic

Hallo zusammen,
besteht die Möglichkeit, sich die Werte eines Kreisdiagramms addiert anzeigen zu lassen?

dos1973

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

@dos1973
Was möchtest du denn machen?
Du kannst css bei allen Widgets einsetzen, musst dann halt entsprechend dir die element zur runtime anschauen und mit CSS dann das überschrieben was du willst.

als Anfang zb. Schrift/ Schriftgröße etc...

ich habe eine switch hinzugefügt und habe es hiermit versucht, (Testweise)
funktioniert aber nicht/ oder nicht richtig.

.mdc-switch .mdc-switch--checked{
    font-size:36px !important;
}

ich glaube ich habe das richtige Element gefunden, aber entweder es verschiebt sich alles total, oder die --checked option, also die Farbe funktioniert nicht. könnte ich eine Beispiel anhand des switch bekommen.

Scrounger

@acramatic sagte in Test Adapter Material Design Widgets v0.1.x:

Hallo zusammen,
besteht die Möglichkeit, sich die Werte eines Kreisdiagramms addiert anzeigen zu lassen?

Mach dir nen Skript das die einzelnen Werte des Kreisdiagramms in einem Datenpunkte addiert und dann mit z.B. nem String Widget den Datenpunkt anzeigen.

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

als Anfang zb. Schrift/ Schriftgröße etc...

Das kannst doch im Editor einstellen über die Kategorie Font.

dos1973

@Scrounger
Das ist klar,
mein vis geht über mehrer Seiten, wenn ich dann etwas ändere wollen würde, dann muss ich das überall manuell machen...

Font und schrift, war nur als Beispiel gedacht.

Scrounger

@dos1973
Eigene CSS Klasse wo du nur die Attribute überschreibst und dann unter allgemein zuweist hast auch probiert?

Beispiel kann ich Grad keine liefern da ich net am Rechner bin, evtl heute Abend

dos1973

@Scrounger
ja, eigene funktionieren nicht.

wie machen das alle anderen hier, alle Werte manuell im Editor?

Scrounger

@dos1973

Geht per css:

.materialdesign-checkbox > label {
    font-size: 50px;
}

und auch mit eigener css klasse:

.myCheckBox > label {
    font-size: 80px;
}

NEWS

Test Adapter Material Design Widgets v0.1.x

Support us

824
Online

31.7k
Users

79.7k
Topics

1.3m
Posts

NEWS

Test Adapter Material Design Widgets v0.1.x

Support us

824Online

31.7kUsers

79.7kTopics

1.3mPosts

824
Online

31.7k
Users

79.7k
Topics

1.3m
Posts