shoaib
(shoaib)
July 28, 2021, 1:43am
1
hi,
now i have added 3 icons as you can see (just to make sure i got things right).
the problem i am facing: i can only click the lower-left icon, nothing happens when i click on the other two. if i keep any single icon by itself in the code, it works.
type: picture-elements
image: local\floorplan\ROOMS_PNG\floorplan.png
elements:
- type: image
entity: switch.ty0226087770039f8fb579_2
style:
left: 50%
top: 50%
width: 100%
state_image:
'on': local\floorplan\ROOMS_PNG\bedroom1.png
'off': local\floorplan\ROOMS_PNG\trans.png
- type: state-icon
entity: switch.ty0226087770039f8fb579_2
style:
left: 76%
top: 30%
width: 100%
tap_action:
action: toggle
- type: image
entity: switch.ty8014125540f520eb1719
style:
left: 50%
top: 50%
width: 100%
tap_action:
action: none
state_image:
'on': local\floorplan\ROOMS_PNG\livingroom-spotlights.png
'off': local\floorplan\ROOMS_PNG\trans.png
- type: state-icon
entity: switch.ty8014125540f520eb1719
tap_action:
action: toggle
style:
left: 100%
top: 70%
width: 100%
- type: image
entity: switch.ty8014125540f520eb1719_3
style:
left: 50%
top: 50%
width: 100%
tap_action:
action: none
state_image:
'on': local\floorplan\ROOMS_PNG\livingroom-lights.png
'off': local\floorplan\ROOMS_PNG\trans.png
- type: state-icon
entity: switch.ty8014125540f520eb1719_3
tap_action:
action: toggle
style:
left: 80%
top: 70%
width: 100%
1 Like
shoaib
(shoaib)
July 28, 2021, 10:08am
2
to anyone having the same issue.
how i solved this: i re-arranged my code to have images first, then i had all the state-icons.
code:
type: picture-elements
image: local\floorplan\ROOMS_PNG\floorplan.png
elements:
- type: image
entity:
- switch.ty0226087770039f902b10_2
style:
left: 50%
top: 50%
width: 100%
tap_action:
action: none
state_image:
'on': local\floorplan\ROOMS_PNG\hall2.png
'off': local\floorplan\ROOMS_PNG\trans.png
- type: image
entity:
- switch.ty0226087770039f902b10
style:
left: 50%
top: 50%
width: 100%
tap_action:
action: none
state_image:
'on': local\floorplan\ROOMS_PNG\hall1.png
'off': local\floorplan\ROOMS_PNG\trans.png
- type: image
entity:
- switch.ty8633086640f520eb19dd
style:
left: 50%
top: 50%
width: 100%
tap_action:
action: none
state_image:
'on': local\floorplan\ROOMS_PNG\bathroom2.png
'off': local\floorplan\ROOMS_PNG\trans.png
- type: image
entity:
- switch.ty0660728870039f905cb7_2
style:
left: 50%
top: 50%
width: 100%
tap_action:
action: none
state_image:
'on': local\floorplan\ROOMS_PNG\bedroom2.png
'off': local\floorplan\ROOMS_PNG\trans.png
- type: image
entity:
- switch.ty0660728870039f905cb7
style:
left: 50%
top: 50%
width: 100%
tap_action:
action: none
state_image:
'on': local\floorplan\ROOMS_PNG\bedroom2.png
'off': local\floorplan\ROOMS_PNG\trans.png
- type: image
entity:
- switch.ty5227015170039f8ff1ce
style:
left: 50%
top: 50%
width: 100%
tap_action:
action: none
state_image:
'on': local\floorplan\ROOMS_PNG\bathroom1.png
'off': local\floorplan\ROOMS_PNG\trans.png
- type: image
entity:
- switch.ty5227015170039f901c0b_3
style:
left: 50%
top: 50%
width: 100%
tap_action:
action: none
state_image:
'on': local\floorplan\ROOMS_PNG\kitchen.png
'off': local\floorplan\ROOMS_PNG\trans.png
- type: image
entity: switch.ty8014125540f520eb1719
style:
left: 50%
top: 50%
width: 100%
opacity: 50%
tap_action:
action: none
state_image:
'on': local\floorplan\ROOMS_PNG\livingroom-spotlights.png
'off': local\floorplan\ROOMS_PNG\trans.png
- type: image
entity: switch.ty8014125540f520eb1719_3
style:
left: 50%
top: 50%
width: 100%
opacity: 50%
tap_action:
action: none
state_image:
'on': local\floorplan\ROOMS_PNG\livingroom-lights.png
'off': local\floorplan\ROOMS_PNG\trans.png
- type: state-icon
entity: switch.ty5227015170039f901c0b_3
style:
left: 65%
top: 70%
width: 100%
tap_action:
action: toggle
- type: state-icon
entity: switch.ty8014125540f520eb1719_3
tap_action:
action: toggle
style:
left: 80%
top: 70%
width: 100%
- type: state-icon
entity: switch.ty0226087770039f8fb579_2
style:
left: 76%
top: 30%
width: 100%
tap_action:
action: toggle
- type: state-icon
entity: switch.ty8014125540f520eb1719
tap_action:
action: toggle
style:
left: 100%
top: 70%
width: 100%
- type: state-icon
entity: switch.ty5227015170039f8ff1ce
tap_action:
action: toggle
style:
left: 105%
top: 17%
width: 100%
- type: state-icon
entity: switch.ty0660728870039f905cb7
tap_action:
action: toggle
style:
left: 122%
top: 22%
width: 100%
- type: state-icon
entity: switch.ty0660728870039f905cb7_2
tap_action:
action: toggle
style:
left: 128%
top: 22%
width: 100%
- type: state-icon
entity: switch.ty0226087770039f902b10_2
tap_action:
action: toggle
style:
left: 109%
top: 45%
width: 100%
- type: state-icon
entity: switch.ty0226087770039f902b10
tap_action:
action: toggle
style:
left: 120%
top: 54%
width: 100%
- type: state-icon
entity: switch.ty8633086640f520eb19dd
tap_action:
action: toggle
style:
left: 135%
top: 54%
width: 100%
1 Like
Awesome, I experienced this issue. Had been moving the code multiple times. Your answer fixed my issue.
Thanks!
shoaib
(shoaib)
September 6, 2021, 8:31pm
4
i am glad someone needed that