How do I go about setting up a toggle button? I realise switches toggle, but they get difficult to tell apart when there are any more than 1 next to each other. I want to make a button that toggles between on/off states and changes colour/text/icon for each state. I have tried the following:
- Dashboard toggle without switch by Ranki; icon changes on click, but if I so much as change the icons in the flow, the switch breaks and becomes unresponsive
- Pushbutton flow - very nice, organised flow that does not work
- Toggle button from Steve's nodered guide (YouTube); recently made, simple flow, but does not seem to work, button is unresponsive
- These 2 buttons from a school exercise toggle state, but do not change appearance and seem quite complex, and are 2x buttons rather than 1
- This button from a German user partially works, toggling state, but does not change appearance:
[{"id":"29e7d45f.dea00c","type":"change","z":"adb29586.1f2388","name":"","rules":[{"t":"set","p":"toggle-me","pt":"flow","to":"payload","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":880,"y":280,"wires":[["38a5d91c.0be77e"]]},{"id":"1b6fe3d1.5580a4","type":"switch","z":"adb29586.1f2388","name":"","property":"toggle-me","propertyType":"flow","rules":[{"t":"true"},{"t":"false"}],"checkall":"true","repair":false,"outputs":2,"x":670,"y":380,"wires":[["8991bf63.f4d578"],["5fec9b00.abd0d4"]]},{"id":"8cddecf3.4a24f","type":"change","z":"adb29586.1f2388","name":"","rules":[{"t":"set","p":"toggle-me","pt":"flow","to":"payload","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":1100,"y":420,"wires":[["38a5d91c.0be77e"]]},{"id":"1e692860.33a6d","type":"change","z":"adb29586.1f2388","name":"","rules":[{"t":"set","p":"toggle-me","pt":"flow","to":"payload","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":1100,"y":340,"wires":[["38a5d91c.0be77e"]]},{"id":"dc371121.720208","type":"inject","z":"adb29586.1f2388","name":"","topic":"","payload":"false","payloadType":"bool","repeat":"","crontab":"","once":true,"onceDelay":0.1,"x":550,"y":280,"wires":[["29e7d45f.dea00c"]]},{"id":"5fec9b00.abd0d4","type":"change","z":"adb29586.1f2388","name":"","rules":[{"t":"set","p":"payload","pt":"msg","to":"true","tot":"bool"}],"action":"","property":"","from":"","to":"","reg":false,"x":870,"y":420,"wires":[["8cddecf3.4a24f"]]},{"id":"8991bf63.f4d578","type":"change","z":"adb29586.1f2388","name":"","rules":[{"t":"set","p":"payload","pt":"msg","to":"false","tot":"bool"}],"action":"","property":"","from":"","to":"","reg":false,"x":870,"y":340,"wires":[["1e692860.33a6d"]]},{"id":"38a5d91c.0be77e","type":"ui_text_input","z":"adb29586.1f2388","name":"","label":"","tooltip":"","group":"65a72644.483318","order":3,"width":0,"height":0,"passthru":true,"mode":"text","delay":300,"topic":"","x":1340,"y":380,"wires":[[]]},{"id":"9af5b2c6.42c3d","type":"ui_button","z":"adb29586.1f2388","name":"","group":"65a72644.483318","order":1,"width":0,"height":0,"passthru":true,"label":"button","tooltip":"","color":"","bgcolor":"","icon":"","payload":"true","payloadType":"bool","topic":"","x":550,"y":380,"wires":[["1b6fe3d1.5580a4"]]},{"id":"f40c5c0.c964128","type":"comment","z":"adb29586.1f2388","name":"At startup set default value (false)","info":"","x":900,"y":240,"wires":[]},{"id":"e62c42b2.ed0408","type":"comment","z":"adb29586.1f2388","name":"if flow.state is true set it to false, if flow.state is false set it to true","info":"","x":990,"y":380,"wires":[]},{"id":"65a72644.483318","type":"ui_group","z":"","name":"Virtuelle Taste BidCoS-RF:1","tab":"fe205248.f04ed","disp":true,"width":"6","collapse":false},{"id":"fe205248.f04ed","type":"ui_tab","z":"","name":"Geräte","icon":"dashboard","order":1}]
