2D simple animated flag shader
This is a simple shader to animate a texture like a flag. You can use the various uniforms to control the look and feel of the flag.
- speed: speed at which the TIME elapses. Basically the wind speed
- frequency_x: frequency of the sine wave for the x axis
- frequency_y: frequency of the sine wave for the y axis
- amplitude_x: amplitude of the distortion for the x axis
- amplitude_y: amplitude of the distortion for the y axis
- inclination: inclination in the x axis, where the flag is attached (left)
I made a video showing you how I made it, check it out here: https://youtu.be/FIYrT8H9Qgg
Feel free to use it however you like!
Shader code
shader_type canvas_item;
uniform float speed = 2.0;
uniform float frequency_y = 5.0;
uniform float frequency_x = 5.0;
uniform float amplitude_y = 50.0;
uniform float amplitude_x = 25.0;
uniform float inclination = 50.0;
void vertex() {
VERTEX.y += sin((UV.x - TIME * speed) * frequency_y) * amplitude_y * UV.x;
VERTEX.x += cos((UV.y - TIME * speed) * frequency_x) * amplitude_x * UV.x;
VERTEX.x -= UV.y * inclination;
}
Awesome, thanks!
Cool