Disturbance effect

yanyan

屏幕扰动效果，类似火焰灼烧空气

需要一张贴图

speed表示扰动的速度

size表示扰动的强度

Shader code
shader_type canvas_item;

uniform sampler2D smoke;
uniform float speed = 0.3;
uniform float size = 0.08;

void fragment(){
	
	vec2 smoke_uv = UV + TIME * speed;
	vec4 smoke_color = texture(smoke, fract(smoke_uv));
	smoke_color = clamp(smoke_color * size, 0.0, 1.0);
	
	vec4 img_color = texture(SCREEN_TEXTURE, SCREEN_UV + vec2(smoke_color.g - size/2.0,0.0));
	
	COLOR = vec4(img_color);
}
Live Preview
The shader code and all code snippets in this post are under CC0 license and can be used freely without the author's permission. Images and videos, and assets depicted in those, do not fall under this license. For more info, see our License terms.

More from yanyan

Related shaders

Comments 5

  2. I'm not sure what I'm doing wrong, but the sprite just becomes invisible

    0

    1. kinda works like this:

      shader_type canvas_item;

uniform sampler2D SCREEN_TEXTURE : hint_screen_texture, filter_linear_mipmap;
uniform sampler2D distortion_pattern;
uniform float intensity = 0.08;
uniform float speed = 0.3;

void fragment() {
  vec2 moving_uv = UV + vec2(TIME * speed, TIME * speed);

  vec2 distortion = texture(distortion_pattern, fract(moving_uv * 0.1)).rg; // Scale the UVs to control the frequency of the distortion
  vec2 distorted_uv = UV + (distortion * 2.0 - 1.0) * intensity;

  distorted_uv = clamp(distorted_uv, vec2(0.0, 0.0), vec2(1.0, 1.0));

  vec4 color = texture(TEXTURE, distorted_uv);

  COLOR = color;
}
      4