Changing an image when clicking an image

[Anonymous]

Hello everyone,

I have a question regarding the image OnSelect.

What I would like to do is when I click on an image (happy smiley), I would like to gray (or change opacity) out the other 2 (neutral and sad) (or replace them by greyed out images).

However they still need to be able to click the other smileys, because a user might change the way he/ she feels.

I can't seem to get this to work...

[WarrenBelz · Accepted solution]

Hi @Anonymous ,

I assume you are using Image controls here.

You can conditionally change their properties (actual image shown) with the Image property based on a Variable that can be set with the OnSelect property of the image. So if you have a variable called vImage (or whatever), and two icons (one grayscale and one color), each icon could have something like (the Smiley Image property)

If(
  vImage = "Smiley",
  colorSmiley,
  greySmiley
)

and the OnSelect of the Smiley

UpdateContext({vImage:"Smiley"})

with these names being the names of the images loaded into your Media.

So each time an icon is pressed, it would go to the color version and the others to the grayscale version.

Please click Accept as solution if my post helped you solve your issue. This will help others find it more readily. It also closes the item. If the content was useful in other ways, please consider giving it Thumbs Up.

[Anonymous]

Hello @WarrenBelz.

Thank you for your reply.

This did the trick!

Thank you very much!