Page 1 of 1

Put an image on top of a background?

PostPosted: Fri Mar 01, 2019 5:18 pm
by summer
This may be a stupid question but I can't figure out how to put an image on top of a background and be able to fade that in and out.

I want this:
Image
Image

But I can only figure out how to do this:
Image
Where the background is always visible through the circle.

Am I missing a node or is it more complex than I initially thought?

Re: Put an image on top of a background?

PostPosted: Fri Mar 01, 2019 5:25 pm
by summer
Now I have something like this:
Image

Is that the correct approach?

Re: Put an image on top of a background?

PostPosted: Fri Mar 01, 2019 5:28 pm
by Amplify_Borba
The only stupid question is the question that is never asked.

- Ramon Bautista


Hello, there should be a couple of ways to achieve this effect, but here's one possible and simple solution which I hope that fits your requirements, in which I make use of the Lerp node:

Image

And the result as you set the slider from 0 to 1, and back to 0:

Image

Please let me know if this helps, thanks!

Re: Put an image on top of a background?

PostPosted: Tue Mar 05, 2019 2:53 pm
by summer
Hey! Thanks for the reply and suggestion.

The problem here is that I don't want the additive effect which is why I had to make it black on the background where the image has to be added.

Basically what I want is a way to just put and image on top of another with transparency based on the image alpha channel. As far as I can see the only two ways of mixing two images is using either add or multiply neither block out the background completely hence the black circle on the background.

Re: Put an image on top of a background?

PostPosted: Wed Mar 06, 2019 11:53 am
by Amplify_Borba
You can also use the Image's alpha channel as the interpolator for the Lerp node:

Image

The result is not additive in this case, rather a blend between both image and background, is this what you're looking for?

Image

Re: Put an image on top of a background?

PostPosted: Mon Mar 11, 2019 1:46 pm
by summer
Wow, thanks so much!

This was exactly what I was hoping for plus I learned something that I can use for other things as well.

Thanks a bunch for excellent support!

Re: Put an image on top of a background?

PostPosted: Wed Mar 13, 2019 12:34 pm
by Amplify_Borba
Happy I was able to help!

Have you had the chance to rate and review Amplify Shader Editor? It would be awesome if you could share your experience with the Unity community, every bit helps and your feedback is extremely valuable to us.

Feel free to get back in touch if you have further issues or questions, thank you!

Re: Put an image on top of a background?

PostPosted: Wed Mar 13, 2019 4:27 pm
by summer
I believe I did some time ago, but I gave you another 5 stars just now.

Re: Put an image on top of a background?

PostPosted: Thu Mar 14, 2019 9:39 am
by Amplify_Borba
Thank you for your kindness, we really appreciate it!