燃烧/burn 2d

A.ling

由mreliptik大佬的shader改（原贴：https://godotshaders.com/shader/2d-dissolve-with-burn-edge/）

加了一个由burn_color到proburn_color再到ash_color的渐变（其实也没改什么）

用法参考原贴

Shader code
shader_type canvas_item;

uniform sampler2D dissolve_texture : source_color;//噪音
uniform float dissolve_value : hint_range(0,1);//溶解程度
uniform float burn_size: hint_range(0.0, 1.0, 0.01);//火焰大小
uniform vec4 ash_color: source_color = vec4(0,0,0,1.0);//灰烬颜色
uniform vec4 burn_color: source_color = vec4(0.882, 0.777, 0.169 , 1.0);//燃烧颜色
uniform vec4 proburn_color: source_color = vec4(0.804, 0.2, 0.093 , 1.0);//超级燃烧颜色

void fragment(){
    vec4 main_texture = texture(TEXTURE, UV);
    vec4 noise_texture = texture(dissolve_texture, UV);
	
	// This is needed to avoid keeping a small burn_color dot with dissolve being 0 or 1
	// is there another way to do it?
	float burn_size_step = burn_size * step(0.001, dissolve_value) * step(dissolve_value, 0.999);
	float threshold = smoothstep(noise_texture.x-burn_size_step, noise_texture.x, dissolve_value);
	float border = smoothstep(noise_texture.x, noise_texture.x + burn_size_step, dissolve_value);
	
	COLOR.a *= threshold;
	vec3 new_burn_color1 = mix(proburn_color.rgb , burn_color.rgb , 1.0-pow(1.0-border , 5));
	vec3 new_burn_color2 = mix(ash_color.rgb , new_burn_color1 , 1.0-pow(1.0-border , 1000));
	COLOR.rgb = mix(new_burn_color2, main_texture.rgb, border);
}
Tags
2d, burn, card, dissolve
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.

Related shaders

Spatial341

3D burn dissolve

Spatial111

Pixel-burn Shader

Canvas item141

Burn Sprite

Subscribe
Notify of
guest

2 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
Nice Catch
Nice Catch
3 months ago

shader_type canvas_item;

uniform sampler2D noise;
uniform float burn_progress: hint_range(0.0, 1.5, 0.1) = 0;
uniform vec4 burn_color = vec4(0.882, 0.777, 0.169 , 1.0);
uniform vec4 ash_color: source_color;
uniform vec4 super_burn_color = vec4(0.804, 0.2, 0.093 , 1.0);
uniform float burn_border: hint_range(0.0, 1, 0.01) = 0.4;

void fragment() {
float a_mask = smoothstep(burn_progress – burn_border, burn_progress, texture(noise, UV).r);
float burn_mask = smoothstep(burn_progress – burn_border, burn_progress, a_mask);
vec3 final_burn_color = mix(ash_color.rgb, super_burn_color.rgb, 1. – pow(1. – burn_mask, 1000));
final_burn_color = mix(final_burn_color, burn_color.rgb, pow(burn_mask, 1000));
COLOR.a *= a_mask;
COLOR.rgb = mix(final_burn_color, COLOR.rgb, step(1, a_mask));
}
这是我的实现，虽然不是一开始就是这么设计的，但是最后的效果是燃烧开始阶段只有burn color，后面随着燃烧范围的扩大，再出现super color和烟（其实这种效果另一个意义上也是种bug，因为没有特殊处理burn_border）

0
Reply
Nice Catch
Nice Catch
3 months ago
Reply to  Nice Catch

shader_type canvas_item;

uniform sampler2D noise;
uniform float burn_progress: hint_range(0.0, 1.5, 0.1) = 0;
uniform vec4 burn_color = vec4(0.882, 0.777, 0.169 , 1.0);
uniform vec4 ash_color: source_color;
uniform vec4 super_burn_color = vec4(0.804, 0.2, 0.093 , 1.0);
uniform float burn_size: hint_range(0.0, 0.9, 0.01) = 0.4;

void fragment() {
float a_mask = smoothstep(burn_progress – burn_size, burn_progress, texture(noise, UV).r);
float born_border = 0.9;
float burn_mask = smoothstep(born_border – burn_size, born_border, a_mask);
vec3 final_burn_color = mix(ash_color.rgb, super_burn_color.rgb, 1. – pow(1. – burn_mask, 1000));
final_burn_color = mix(final_burn_color, burn_color.rgb, pow(burn_mask, 1000));
COLOR.a *= a_mask;
COLOR.rgb = mix(final_burn_color, COLOR.rgb, step(1, a_mask));
}
重新改了下，感觉这个效果更好。（评论什么时候支持图片呀。。。）

0
Reply