I want to make a transparent blurred main window so that the desktop elements are blurred, but I only made transparency
pls hlp…
You can add a material to your CanvasItem. Within the material, use a blur shader. Here I can recommend this website which is providing a lot of ready-to-use shaders.
1 Like
I probably didn’t explain it well.
I wanted the elements outside the window to be transparent, is there such a possibility?
it’s possible, just set it borderless and create your own texture with bottom of it transparent, set it as the styletexture of the window
1 Like
texture? where should I put the shader?
I have the same problem, any help?
here is a much better shader i made with GPT hope this helps
// A Gaussian blur shader for Godot 4.3
shader_type canvas_item;
uniform sampler2D SCREEN_TEXTURE : hint_screen_texture, filter_linear_mipmap;
// The radius of the blur effect (number of pixels to blur).
uniform int blur_radius : hint_range(1, 32) = 8;
// Controls the intensity of the blur.
uniform float blur_strength : hint_range(0.1, 10.0) = 1.0;
// Precomputed weights for the Gaussian kernel.
float gaussian_weight(float i, float sigma) {
return exp(-0.5 * (i * i) / (sigma * sigma));
}
// Precomputes the weights for the Gaussian kernel.
void calculate_kernel(out float kernel[32], int radius, float sigma) {
float sum = 0.0;
for (int i = 0; i <= radius; i++) {
kernel[i] = gaussian_weight(float(i), sigma);
sum += i == 0 ? kernel[i] : 2.0 * kernel[i];
}
for (int i = 0; i <= radius; i++) {
kernel[i] /= sum;
}
}
void fragment() {
vec2 resolution = SCREEN_PIXEL_SIZE;
vec2 uv = SCREEN_UV;
// Gaussian kernel weights.
float kernel[32];
calculate_kernel(kernel, blur_radius, blur_strength);
// Apply Gaussian blur in both directions (radial blur).
vec3 final_color = vec3(0.0);
float total_weight = 0.0;
for (int x = -blur_radius; x <= blur_radius; x++) {
for (int y = -blur_radius; y <= blur_radius; y++) {
float weight = kernel[abs(x)] * kernel[abs(y)];
vec2 offset = vec2(float(x), float(y)) * resolution;
final_color += texture(SCREEN_TEXTURE, uv + offset).rgb * weight;
total_weight += weight;
}
}
// Normalize the color.
final_color /= total_weight;
// Output the blurred color.
COLOR = vec4(final_color, 1.0);
}
1 Like
Do I need to attach this shader with a color rect?
THIS IS SHIT … it made my 3060 run at 100% for just a simple blur
it turns out their is this thing called kernal in Gaussian blur that it calculates and it should not because it is recursive and it does it for every pixel … I tried to add the number directly but could not get it working yet …
1 Like
no i used it on a panel
1 Like
these do not work for me.
How come?
it does not blur what’s behind the window.
Then I recommend you make a new post in this forum telling us what you’ve actually tried, what you’re seeing and what you expected to see. Screenshots would be helpful. You can always post a link to this old thread for reference
You’ve resurrected an old post with a lot of comments and it’s old enough that the solutions may not work without changes. You also gave no information to help solve your problem. You have a better chance of getting help if you start fresh and tell us what your problem is instead of making assumptions that your version of Godot, setup, operating system, project, etc are the exact same as the original poster’s were last year.
I did everything that’s mentioned in this thread, as well as multiple other shaders and nodes and techniques, and nothing had any effect. I’m pretty sure it’s just impossible.
nodes / scene:
after playing the game. the in-game objects get blurred, what’s behind the window does not.
That’s pretty different from “these do not work for me.”
So here’s the problem. Your shader, whatever you’re using, is only being applied to the image. It needs to be applied to the whole screen. This shader is likely taking a picture of whatever it’s on and modifying only that. It could be that it’s ignoring anything transparent and that’s why it’s not affecting the background.
If you want the whole screen affected, just stretch something invisible over the whole screen and then apply your shader to that.
That’s already what I’m doing. The shader is affecting the nodes below it in the scene, but it does not affect what’s behind the transparent window. The boxes outlined in my first image are the transparent elements with the shader effect applied. In the second image you can see it’s blurring the purple image behind it, but when the box extends below it, the godot editor open behind it does not get blurred.