Making a UI element glow?

I’m trying to make a UI element glow when it is clicked. Right now I just have two static images that were made in Photoshop, one with a glow and one without. When clicked I fade the opacity of the image without glow to 0 and the opacity of the image with glow to 1.

It’s an OK solution but it feels like I’m doing it the hard way. I have to create a unique “glow” image for each of my icons, it adds to the overall size of the exe that is created when Unity builds and the glow doesn’t play off any of the other elements (like the background).

Is there an easy way to make one of the UI elements glow like this in Unity? I tried an additive shader but it doesn’t give the full effect. It gives the right color, but doesn’t fuzz around the edges, making the image grow a bit like you’d see in a neon light. It also still doesn’t play off the other parts of the scene.

2426658--166194--upload_2015-12-16_14-8-57.png

Check out the SoftAlphaMask in the UIExtensions project (link in sig), should be able to overlay elements with that.
Failing that, put a request in to the BitBucket site and see if anyone picks it up.

Another option is to either use a button / selectable control and using the colour tint or sprite swap options to have a different highlighted image / colour. or write your own sprite swap effect. Would be simpler.

2 Likes

Oh, nice, thank you for introducing me to that UI Extensions project. That looks like it will prove to be pretty helpful.

I think just using two different images, and then switching them sounds like it would be the simplest option.

2 Likes

A lot of game’s effects are illusions. It’s cheaper, simpler, same result. +1 for this suggestion.

However, it may make the entire project heavier on sprite sheets or atlas.

1 Like