2D Drop Shadow using alpha

This is a 2D drop shadow designed for canvas items.  It uses the alpha of the input texture to direct the shadow.  The direction of the shadow is a parameter and can be changed by the application

For an example you can look at the example/path2dslider/scenes/arc.tscn in the godot-path2dslider plugin repository on GitHub (https://github.com/markeel/godot-path2dslider)

In the cover image the two markers (1 and 5) are using the same texture, but the application is adjusting the “offset” shader parameter to be a consistent global direction (independent of the individual texture rotation), allowing the control to give the illusion of a light source above and to the right.

Shader code

shader_type canvas_item;

uniform sampler2D color : source_color;
uniform vec2 offset;
uniform float shadow_alpha;

void fragment() {
	vec4 c = texture(color, UV);
	if (c.a < 1.0) {
		vec4 cr = texture(color, UV - offset);
		if (cr.a > 0.0) {
			c.rgb = clamp(c.rgb * c.a + vec3(0.0, 0.0, 0.0) * cr.a * shadow_alpha * (1.0 - c.a), vec3(0.0, 0.0, 0.0), vec3(1.0, 1.0, 1.0));
			c.a = clamp(c.a + cr.a * shadow_alpha * (1.0 - c.a), 0.0, 1.0);
		}
	}
		
	COLOR = c;
}

Tags