Status LED mit verschiedenen Farben und Blinken

[luft-post]

Moin zusammen,
ich stehe gerade auf den schlauch. Ich suche für mein VIS eine LED (ausgefüllter Kreis) den ich je nach wert Rot,Orang,Grün und an besten noch Rot Blinken machen kann. aber irgendwie finde ich gerade kein passendes Widget

habt Ihr einen Tip für mich

gruß
Matthias

[Maas-Meister]

@luft-post

Füge dir mal den Inventwo Adapter hinzu.
Anschließend hast du in deine Vis mit den Inventwo-Widgets sehr viel Gestaltungmöglichkeiten.
z.B. mit dem Multi Widget einen DP abfragen und mehrere Zustände anlegen.
Zustand 1: Bild oder Hintergrund leuchtet Rot
Zustand 2: Bild oder Hintergrund blinkt grün

etc.

Mfg

[luft-post]

@maas-meister vielen Dank, werde ich mir anschauen

[liv-in-sky]

@luft-post

geht auch mit frame widget

widget zum import

[{"tpl":"tplIFrame","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":false,"g_css_background":true,"g_css_shadow_padding":false,"g_css_border":true,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","refreshInterval":"0","seamless":"true","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,"class":"{val:controll-own.0.AAATEST.TestZahl2;  val>4 ?  \"blink-red\"  : \"\"}"},"style":{"left":"195px","top":"258px","width":"30px","height":"30px","border-radius":"15px","border-width":"1px","border-style":"solid","border-color":"{val:controll-own.0.AAATEST.TestZahl2; val<=2 ? \"lightgreen\" : val<=4 ? \"yellow\" : val>4 ?  \"#ff6633\"  : \"#ff6633\"}","background":"","background-color":"{val:controll-own.0.AAATEST.TestZahl2; val<=2 ? \"lightgreen\" : val<=4 ? \"yellow\" : val>4 ?  \"#ff6633\"  : \"#ff6633\"}"},"widgetSet":"basic"}]

das muss in den css tab in der vis

Spoiler

.blink-red   {
 animation: mdui-red-blink-ani 3s linear infinite;
}
@keyframes mdui-red-blink-ani  {
 0%,50% {filter: drop-shadow(0px 0px 4px #F44336) drop-shadow(0px 0px 4px #F44336) drop-shadow(0px 0px 4px #F44336); }
 51% {filter: none;}

}