Der neue Monatsrückblick für Mai und Juni 2026 ist online!

[Sven2013]

Hallo,

kann mir jemand mal ein Beispiel einstellen, wie ich so etwas im Material Design von Uhula realisiere? Es geht nur um einzelne Widgets:

Hier mal das Beispiel wie ich es vorher im metro Design gebaut habe.

Hier der wigdget export dazu :

! [{"tpl":"tplMetroTileList8","data":{"oid":"hm-rpc.0.LEQ0630255.1.STATE","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":true,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","label0":"geschlossen","label1":"gekippt","label2":"offen","label3":"Value list","label4":"Value list","label5":"Value list","label6":"Value list","label7":"Value list","bg_class0":"bg-dark","bg_class1":"bg-dark","bg_class2":"bg-dark","bg_class3":"bg-indigo","bg_class4":"bg-indigo","bg_class5":"bg-indigo","bg_class6":"bg-indigo","bg_class7":"bg-indigo","icon_class0":"","icon_class1":"","icon_class2":"","icon_class3":"icon-pencil","icon_class4":"icon-pencil","icon_class5":"icon-pencil","icon_class6":"icon-pencil","icon_class7":"icon-pencil","icon_badge0":"","icon_badge1":"","icon_badge2":"","icon_badge3":"icon-pencil","icon_badge4":"icon-pencil","icon_badge5":"icon-pencil","icon_badge6":"icon-pencil","icon_badge7":"icon-pencil","badge_bg_class0":"","badge_bg_class1":"","badge_bg_class2":"","badge_bg_class3":"bg-cyan","badge_bg_class4":"bg-cyan","badge_bg_class5":"bg-cyan","badge_bg_class6":"bg-cyan","badge_bg_class7":"bg-cyan","brand_bg_class0":"ribbed-emerald","brand_bg_class1":"ribbed-orange","brand_bg_class2":"ribbed-red","brand_bg_class3":"ribbed-steel","brand_bg_class4":"ribbed-steel","brand_bg_class5":"ribbed-steel","brand_bg_class6":"ribbed-steel","brand_bg_class7":"ribbed-steel","badge_top":"0","badge_left":"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":"5","signals-vert-0":"8","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,"label_prepend":"Seitentür ","icon0":"/icons-mfd-png/fts_window_1w.png","icon1":"/icons-mfd-png/fts_window_1w_tilt.png","icon2":"/icons-mfd-png/fts_window_1w_open.png","icon_width":"80","icon_height":"80","icon_top":"22","icon_left":"42","signals-oid-0":"hm-rpc.0.LEQ0630255.1.LOWBAT","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":"360px","top":"210px","width":"106px","height":"96px"},"widgetSet":"metro"}]

Tanken Widget:

! [{"tpl":"tplMetroTileString","data":{"hm_id":65535,"digits":"","factor":1,"min":0,"max":1,"step":0.01,"icon_class_true":"","icon_class_false":"","icon_badge_true":"","icon_badge_false":"","bg_class_true":"ribbed-emerald","bg_class_false":"ribbed-emerald","badge_bg_class_true":"","badge_bg_class_false":"","brand_bg_class_true":"","brand_bg_class_false":"","icon":"","icon_false":"/icons-mfd-png/scene_gas_station.png","label_id":"","label_append":" ","label_prepend":"Esso","content_prepend":"","content_append":" €","icon_width":"58","icon_height":"59","select_on_true":false,"badge_top":"0","badge_left":"0","content_oid":"tankerkoenig.0.stations.0.e5.feed","state_oid":"","g_visibility":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","g_fixed":false,"icon_top":"48","icon_left":"45","g_signals":true,"signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":"","signals-blink-0":true,"signals-horz-0":"5","signals-vert-0":"8","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,"g_css_background":false,"g_gestures":false,"icon_true":"/icons-mfd-png/weather_cloudy.png","signals-oid-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":"360px","top":"580px","text-align":"center","line-height":"","font-family":"Comfortaa-Bold","font-style":"","font-variant":"","color":"","width":"106px","height":"96px","z-index":"15"},"widgetSet":"metro"}]

Vielen Dank für Tips :-)

Gruß Sven