Gradient transparency on control node

Help
1

Godot Version

4.4

Question

Is there any way to add a ramp/gradient to Control nodes (Label, TextureRect, Button,. etc.) to make them spatially fading?

If I wanted a “simple green square” to be opaque at the top and transparent at the bottom, what’s the best way to achieve that without having to write a shader for it?

2

Not all control nodes have a visual element to them, but for the ones that do, you could add a StyleBoxTexture to the theme property they have that shows a visual.

3

I see. YOu mean use a StyleBoxTexture and paint an actual gradient to use as opacity mask?

4

It’s not a mask, the actual texture should be a gradient. If you want everything in the control node to turn transparent like the gradient, then you should use a shader.

5

Thanks, I’ll play with this idea tonight!

6

I ended up writing a fragment shader for this, where I can produce a gradient and control its orientation via exposed shader parameters.