Screentone scene transition
In Color is the color of transition in effect
Out Color is the color of transition out effect
In Out set which color to pick, If the value greater than 0.5. The color will be Out color otherwise it will be the In color.
Position the a slide from -1.5 to 1 if it set to 1, whole screen will be reveal. If it -1.5, whole screen will be cover.
Size size of circles
Shader code
shader_type canvas_item;
uniform vec4 in_color:hint_color;
uniform vec4 out_color:hint_color;
uniform float in_out:hint_range(0.,1.)=0.;
uniform float position:hint_range(-1.5,1.) = 0.856;
uniform vec2 size = vec2(16., 16.);
void fragment(){
vec2 a = (1./SCREEN_PIXEL_SIZE) / size;
vec2 uv=UV;
uv *= a;
vec2 i_uv = floor(uv);
vec2 f_uv = fract(uv);
float wave = max(0.,i_uv.x/(a.x) - position);
vec2 center = f_uv*2.-1.;
float circle = length(center);
circle = 1. - step(wave,circle);
vec4 color = mix(in_color, out_color, step(0.5, in_out));
COLOR=vec4(circle) * color;
}
Amazing. Thank you
Anyone interested in using this for Godot 4.x, some adjustments to make compared to the example project:
You’ll need to clear the Tween node out of the Changer scene (this Node type no longer exists). Replace that by adding
Into both the In and Out functions. Then replace the $Tween references to tween. Also replace .start() with .play()
Replace the interpolate_property stuff with new Tween class methods like this:
for the new Tween options.
Finally, when I was testing I found the Out function strangely lagged, while the In function worked fine. Seems the solution is to always write the shader position as a float in your function, i.e. the example just used 1 for the initial position, so change that to 1.0 or another float value. If the initial position is mistaken as an integer it will only show the tween positions that align with integer values aka 1, 0, -1.
Unfortunately I see a momentary screen flicker when the scene transitions. Haven’t worked with it enough to solve that yet. I’m guessing the flicker is a single frame where the new tween for the In function is created after the Result scene loads. So maybe if Changer isn’t a child of both From and Result, but instead everything is handled inside a scene managing parent node; that way Changer is persistent even when the displayed game scene changes? Hopefully this helps anyone else make it work, as this is a nice looking transition effect.