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

[tourer4778]

@CrunkFX
Ja, das hatte ich zu Anfang auch.
Mir hat die Darstellung teilweise nicht gefallen.
Der Button nice green & red zum beispiel, bleibt grau, wenn ich ihn auf meinem Handy betätige. Am PC mit Maus funktioniert der Farbwechsel. Kann man das Graue abschalten ?
Der Button red & green active hat unterschiedliche schriften und diese sind nicht mittig.

[tourer4778]

@CrunkFX
Kann man noch weitere Änderungen an dem HQ Button vornehmen ?

[CrunkFX]

@tourer4778 Klar, du kannst im Prinzip alles anpassen was du willst. Was genau möchtest Du denn?

[tourer4778]

@CrunkFX
Der HQ Button Stil nice green & red zum beispiel, bleibt grau, wenn ich ihn auf meinem Handy betätige. Am PC mit Maus funktioniert der Farbwechsel. Kann man das Graue abschalten ?
Der HQ Button Stil red & green active hat unterschiedliche schriften und diese sind nicht mittig.

[CrunkFX]

@tourer4778 Über Browser oder IOB App. Das ist nicht normal dass die ansicht auf dem Handy anders funktioniert.

[tourer4778]

@CrunkFX
Browser
Wenn ich am PC im Browser über den Button drüber fahre, wird er ja auch Grau.
Ich vermute, das am Handy wie auch am Pad die "Maus" dann auf dem Button stehen bleibt.
betätige ich danach ein anderen Button auf der Seite, wechselt die Zustandsfarbe.
Nur das gefällt mir halt nicht, das ich den Zustand nicht sofort sehe.

[CrunkFX]

@tourer4778 sagte in Vis tplHqButton Schalter schaltet manchmal nicht richtig:

Ich vermute, das am Handy wie auch am Pad die "Maus" dann auf dem Button stehen bleibt.

Nö, die Touchevents funktionieren komplett anders als eine virtuelle Maus. Ich tippe eher auf einen Konfigurationsfehler. Könntest du mir das Widget mal exportieren dann schau ich mir das an.

[tourer4778]

@CrunkFX

[{"tpl":"tplHqButton","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":true,"g_css_background":true,"g_css_shadow_padding":true,"g_css_border":true,"g_gestures":true,"g_signals":true,"g_last_change":false,"oid":"s7.0.DBs.DB36.Temp_Regelung_2_Pool","min":"false","max":"true","iconName":"","btIconWidth":"0","offsetAuto":"true","leftOffset":"0","topOffset":"0","timeAsInterval":false,"infoLeftFontSize":"0","infoFontRightSize":"0","infoLeftPaddingLeft":"0","infoLeftPaddingRight":"0","infoRightPaddingRight":"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":"","signals-icon-2":"","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"g_styles":true,"waveColor":"#183cec","pushButton":false,"caption":"Temperatur<br>Regelung 2","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,"usejQueryStyle":false,"styleNormal":"hq-button-nice-red","styleActive":"hq-button-nice-green","gestures-rotating-maximum":"-4","gestures-rotating-delta":"1","descriptionLeft":"HMI Button An / Aus","gestures-offsetX":"3","visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","testActive":false},"style":{"left":"486px","top":"273px","border-radius":"6px","width":"111px","height":"60px","background-color":"","font-family":"","text-align":"center","color":"#000000","font-size":"x-small","z-index":"3"},"widgetSet":"hqwidgets"}]

[tourer4778]

@CrunkFX

Wie gesagt, wenn ich mit der MAus drauf bleibe, bleibt das auch grau und änder seinen Zustand nicht.

[tourer4778]

@CrunkFX

Ich habe nun den HqButton soweit angepasst. Wenn ich Ihn als Schalter nehme wird mir ja der Status angezeigt, beispielsweise Grün und Rot. Aber wenn ich Ihn als Taster nehme nicht. Hier gibt es wohl noch keine möglichkeit, den Taster dauerhaft den Status anzeigen zu lassen, oder ?

[CrunkFX]

@tourer4778 Hi, doch das geht mit nem CSS Trick. Ich mach dir das morgen Mal fertig für deinen Taster. Welche Werte haben ein und aus? True und false oder 1 und 0?

[tourer4778]

@CrunkFX sagte in Vis tplHqButton Schalter schaltet manchmal nicht richtig:

@tourer4778 Hi, doch das geht mit nem CSS Trick. Ich mach dir das morgen Mal fertig für deinen Taster. Welche Werte haben ein und aus? True und false oder 1 und 0?

True und False

[{"tpl":"tplHqButton","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":true,"g_css_background":true,"g_css_shadow_padding":true,"g_css_border":true,"g_gestures":true,"g_signals":false,"g_last_change":false,"oid":"s7.0.DBs.DB4.Freigabe_Garten_Beleuchtung","min":"false","max":"true","iconName":"","btIconWidth":"0","offsetAuto":"true","leftOffset":"0","topOffset":"0","timeAsInterval":false,"infoLeftFontSize":"0","infoFontRightSize":"0","infoLeftPaddingLeft":"0","infoLeftPaddingRight":"0","infoRightPaddingRight":"0","g_styles":true,"pushButton":false,"caption":"Garten Beleuchtung","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,"gestures-rotating-maximum":"0","gestures-rotating-delta":"0","descriptionLeft":"HMI Button An / Aus","gestures-offsetX":"0","visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","captionOn":"","gestures-rotating-minimum":"0","gestures-offsetY":"0","gestures-swiping-delta":"0","gestures-pinching-maximum":"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,"styleNormal":"hq-button-no-background","styleActive":"hq-button-glossy-green","testActive":false,"gestures-swiping-maximum":"0"},"style":{"left":"241px","top":"196px","border-radius":"6px","width":"110px","height":"40px","background-color":"##da0b23","font-family":"","text-align":"center","color":"#000000","font-size":"small","z-index":"9","border-color":"","border-style":"","margin-bottom":""},"widgetSet":"hqwidgets"}]

[CrunkFX]

@tourer4778 Mahlzeit, also folgendes
Du trägst bei CSS Klasse das hier ein und passt 0_Userdata.0.test1 entsprechend dem Status Datenpunkt an.

{wert:0_userdata.0.test1; wert==true ? "ButtonGreen" : "ButtonRed" }

Object ID sollte klar sein, da hat sich nix geändert nur zum testen hab ich da was anderes drinne stehen.

Zuletzt noch bei CSS
Das hier eintragen und eventuell die Farben anpassen:

.ButtonRed  {
background: red !important;
}
.ButtonGreen  {
background: green !important;
}

Das sollte es tun.

MFG
CrunkFX

[tourer4778]

@CrunkFX
Okay, danke, werde ich heute Abend testen.

EDIT :
So, gerade mal fix getestet.
Funktioniert soweit, nur leider dann wieder das gleich Problem mit dem Prellen (Grün > Rot > Grün wechselt zwei drei mal).

[CrunkFX]

@tourer4778 Dann prellt aber dein S7 Datenpunkt. Kannst du im Adapter oder der Anlage debounce Einstellen. Ansonsten vielleicht Mal im GitHub Repo vom S7 Adapter schauen und schauen ob jemand anders eventuell hier im Forum auch ein Problem mit dem s7 Adapter hat. Ich kann später Mal schauen ob sich debounce mit CSS realisieren lässt.