Neuer ioBroker-Blog online: Monatsrückblick März/April 2026

[iobroker2001]

Guten Abend,
für einen Button, der einen Shelly steuert, möchte ich die (Hintergrund-)Farbe ändern, wenn dieser "offline" wird.
So etwas funktioniert:

{wert:shelly.0.SHPLG-S#9A2FBF#1.online; wert == "false" ? "#775522" : "#fe9a2e" }

Jetzt möchte ich aber die 2 Hexfarbenwerte durch Verweise auf Datenpunkte ersetzen, z. B. so etwas:

vis-inventwo.0.CSS.Button

In diesem DP steht dann die eigentliche Farbe.

Irgendeine Idee?
Vielen Dank!

[liv-in-sky]

@iobroker2001 sagte in VIS: Bedingtes Binding für Farbe:

{wert:shelly.0.SHPLG-S#9A2FBF#1.online; wert == "false" ? "#775522" : "#fe9a2e" }

binding in binding geht nicht - daher versuch mal:

{wert:shelly.0.SHPLG-S#9A2FBF#1.online; wertcolor1:vis-inventwo.0.CSS.Button; wert == "false" ? wertcolor1 : "#fe9a2e" }

[Glasfaser]

@iobroker2001 sagte in VIS: Bedingtes Binding für Farbe:

in diesem DP steht dann die eigentliche Farbe*

Dann nimm doch diesen Datenpunkt in den Widget Farbeinstellungen als Binding

{vis-inventwo.0.CSS.Button}

[iobroker2001]

@liv-in-sky sagte in VIS: Bedingtes Binding für Farbe:

{wert:shelly.0.SHPLG-S#9A2FBF#1.online; wertcolor1:vis-inventwo.0.CSS.Button; wert == "false" ? wertcolor1 : "#fe9a2e" }

Das funktioniert leider nicht, da wird das Farbattribut im Offline-Fall nicht mehr umgeschaltet.

[iobroker2001]

@glasfaser Dieses Attribut soll ja nur bedingt genommen werden.

[liv-in-sky]

@iobroker2001 sagte in VIS: Bedingtes Binding für Farbe:

Offline-Fall

was ist der offline fall

es sollte funktionieren, wenn der shelly dp getriggert ist - du kannst natürlich nicht die farbe ändern (vis-inventwo.0.CSS.Button )und hoffen, dass sich das in der vis auswirkt - der trigger ist der shelly

[iobroker2001]

@liv-in-sky Der Offline-Fall ist:
shelly.0.SHPLG-S#9A2FBF#1.online ist false
Das funktioniert ja auch. Die Farbe, die durch vis-inventwo.0.CSS.Button definiert ist, ändere ich nicht.
Dies hier:

{wert:shelly.0.SHPLG-S#9A2FBF#1.online; wertcolor1:vis-inventwo.0.CSS.Button; wert == "false" ? "#775522" : wertcolor1 }

funktioniert nicht.
Ich arbeite mit dem VIS-Inventwo-Universal-Switch-Widget, Attribut "Hintergrund".

[liv-in-sky]

@iobroker2001 könnte am widget liegen

ich stelle es mal nach

[iobroker2001]

@liv-in-sky Danke!

[liv-in-sky]

@iobroker2001

poste mal dein widget - in code tags - zum import

[iobroker2001]

@liv-in-sky

[{"tpl":"i-vis-universal","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,"iUniversalWidgetType":"Switch","iValueType":"boolean","iValueComparison":"equal","iStateResponseTime":"0","iStateResetValueTime":"0","iNavWait":"100","iHttpType":"iSend","iPopUpBackground":"#666666","iPopUpPreventClickOutside":"","iPopUpShowTitle":"true","iPopUpTitle":"","iPopUpTitleColor":"#ffffff","iPopUpCloseBtnColor":"#dc2e2e","iPopUpWidth":"800px","iPopUpHeight":"500px","iPopUpHeightTitle":"50","iPopUpTitleSize":"28","iPopUpPosition":"center","iPopUpPositionX":"0","iPopUpPositionY":"0","iPopUpCloseAfterSeconds":"0","iPopUpCornerRadiusUL":"12","iPopUpCornerRadiusUR":"0","iPopUpCornerRadiusLR":"12","iPopUpCornerRadiusLL":"0","iPopUpShadowXOffset":"2","iPopUpShadowYOffset":"2","iPopUpShadowBlur":"2","iPopUpShadowSpread":"1","iPopUpShadowColor":"#111111","iButtonCol":"{vis-inventwo.0.CSS.Button}","iButtonActive":"{wert:shelly.0.SHPLG-S#9A2FBF#1.online; wert == \"false\" ? \"#775522\" : \"#fe9a2e\" }","iButtonColHover":"","iOpacityBack":"1","iCornerRadiusUL":"12","iCornerRadiusUR":"0","iCornerRadiusLR":"12","iCornerRadiusLL":"0","iContentFlexDirection":"vertical","iContentVertAlign":"iSpace-between","iContentOrder":"orderImgText","iOpacityCtn":"1","iContentType":"image","iTextColor":"#ffffff","iTextColorActive":"#ffffff","iTextSize":"16","iTextAlign":"iCenter","iTextDecoration":"none","iTextSpaceTop":"0","iTextSpaceBottom":"0","iTextSpaceLeft":"0","iTextSpaceRight":"0","iIconSize":"50","iImgAlign":"iCenter","iImgSpaceTop":"5","iImgSpaceBottom":"0","iImgSpaceLeft":"0","iImgSpaceRight":"0","iImgRotation":"0","iImgBlinkFalse":"0","iImgBlinkTrue":"0","iImgColorFalse":"","iImgColorTrue":"","iImgClockFace":"01","iImgClockHands":"01","iImgClockShowBorder":"1","iImgColorClockFace":"#ffffff","iImgColorHands":"#ffffff","iImgColorHandSecond":"#ff0000","iClockShowSeconds":"","iClockTimezone":"Europe/Berlin","iHtmlTextFieldFalse":"","iHtmlTextFieldTrue":"","iShadowXOffset":"2","iShadowYOffset":"2","iShadowBlur":"2","iShadowSpread":"1","iShadowColor":"#111111","iShadowColorActive":"#111111","iShadowColorHover":"","iShadowInnerXOffset":"0","iShadowInnerYOffset":"0","iShadowInnerBlur":"0","iShadowInnerSpread":"0","iShadowInnerColor":"#111111","iShadowInnerColorActive":"#111111","iShadowInnerColorHover":"","iShadowTextXOffset":"0","iShadowTextYOffset":"0","iShadowTextBlur":"0","iShadowTextColor":"#111111","iShadowTextColorActive":"#111111","iBorderSize":"0","iBorderStyle":"none","iBorderColor":"#ffffff","iBorderColorActive":"#ffffff","iBorderColorHover":"","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":"shelly.0.SHPLG-S#9A2FBF#1.Relay0.Switch","iTextTrue":"<b>ST13 Teichpumpe</b>","iTextFalse":"<b>ST13 Teichpumpe</b>","iImageTrue":"","iImageFalse":"","visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide"},"style":{"left":"118px","top":"4px","width":"100px","height":"100px"},"widgetSet":"vis-inventwo"}]

Das ist die Version mit den Hexcodes, die durch andere Datenpunkte ersetzt werden sollen.

[liv-in-sky]

@iobroker2001

du meinst das so:

funktioniert ?

[iobroker2001]

@liv-in-sky Exakt!

[liv-in-sky]

@iobroker2001

sind deine datenpunkte im type auch 2 mal logik und 2 mal string (farben)

[liv-in-sky]

@iobroker2001

ich habe nur dein widget genommen und meine datenpunkte verwendet

Spoiler

[{"tpl":"i-vis-universal","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,"iUniversalWidgetType":"Switch","iValueType":"boolean","iValueComparison":"equal","iStateResponseTime":"0","iStateResetValueTime":"0","iNavWait":"100","iHttpType":"iSend","iPopUpBackground":"#666666","iPopUpPreventClickOutside":"","iPopUpShowTitle":"true","iPopUpTitle":"","iPopUpTitleColor":"#ffffff","iPopUpCloseBtnColor":"#dc2e2e","iPopUpWidth":"800px","iPopUpHeight":"500px","iPopUpHeightTitle":"50","iPopUpTitleSize":"28","iPopUpPosition":"center","iPopUpPositionX":"0","iPopUpPositionY":"0","iPopUpCloseAfterSeconds":"0","iPopUpCornerRadiusUL":"12","iPopUpCornerRadiusUR":"0","iPopUpCornerRadiusLR":"12","iPopUpCornerRadiusLL":"0","iPopUpShadowXOffset":"2","iPopUpShadowYOffset":"2","iPopUpShadowBlur":"2","iPopUpShadowSpread":"1","iPopUpShadowColor":"#111111","iButtonCol":"{vis-inventwo.0.CSS.Button}","iButtonActive":"{wert:0_userdata.0.CONTROL-OWN.AAATEST.TestLogic; wertcolor1:0_userdata.0.CONTROL-OWN.AAATEST.TestString3;wertcolor2:0_userdata.0.CONTROL-OWN.AAATEST.TestString4; wert == \"false\" ? wertcolor2 : wertcolor1 }","iButtonColHover":"","iOpacityBack":"1","iCornerRadiusUL":"12","iCornerRadiusUR":"0","iCornerRadiusLR":"12","iCornerRadiusLL":"0","iContentFlexDirection":"vertical","iContentVertAlign":"iSpace-between","iContentOrder":"orderImgText","iOpacityCtn":"1","iContentType":"image","iTextColor":"#ffffff","iTextColorActive":"#ffffff","iTextSize":"16","iTextAlign":"iCenter","iTextDecoration":"none","iTextSpaceTop":"0","iTextSpaceBottom":"0","iTextSpaceLeft":"0","iTextSpaceRight":"0","iIconSize":"50","iImgAlign":"iCenter","iImgSpaceTop":"5","iImgSpaceBottom":"0","iImgSpaceLeft":"0","iImgSpaceRight":"0","iImgRotation":"0","iImgBlinkFalse":"0","iImgBlinkTrue":"0","iImgColorFalse":"","iImgColorTrue":"","iImgClockFace":"01","iImgClockHands":"01","iImgClockShowBorder":"1","iImgColorClockFace":"#ffffff","iImgColorHands":"#ffffff","iImgColorHandSecond":"#ff0000","iClockShowSeconds":"","iClockTimezone":"Europe/Berlin","iHtmlTextFieldFalse":"","iHtmlTextFieldTrue":"","iShadowXOffset":"2","iShadowYOffset":"2","iShadowBlur":"2","iShadowSpread":"1","iShadowColor":"#111111","iShadowColorActive":"#111111","iShadowColorHover":"","iShadowInnerXOffset":"0","iShadowInnerYOffset":"0","iShadowInnerBlur":"0","iShadowInnerSpread":"0","iShadowInnerColor":"#111111","iShadowInnerColorActive":"#111111","iShadowInnerColorHover":"","iShadowTextXOffset":"0","iShadowTextYOffset":"0","iShadowTextBlur":"0","iShadowTextColor":"#111111","iShadowTextColorActive":"#111111","iBorderSize":"0","iBorderStyle":"none","iBorderColor":"#ffffff","iBorderColorActive":"#ffffff","iBorderColorHover":"","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":"0_userdata.0.CONTROL-OWN.AAATEST.TestLogic2","iTextTrue":"<b>ST13 Teichpumpe</b>","iTextFalse":"<b>ST13 Teichpumpe</b>","iImageTrue":"","iImageFalse":"","visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide"},"style":{"left":"201px","top":"969px","width":"100px","height":"100px"},"widgetSet":"vis-inventwo"}]

[iobroker2001]

@liv-in-sky Das funktioniert super!

Vielen Dank! Du hast mir sehr geholfen!
Schönen Sonntag noch!