opengl - 如何在 spritekit 中构建一个简单的 2d 闪光爆炸

Question

我想达到这样的效果

https://www.youtube.com/watch?v=1e2a9-O ​​KXmI (0:27) 就像一个双圈长大爆炸，但有一些不规则的形状，看起来很有机

我相信使用精灵表并不是最好的主意，所以也许是着色器？

实现类似目标的最佳方法是什么？

编辑：

shadertoy https://www.shadertoy.com/view/3dcfWj中的这段代码看起来与我想要的非常相似

#define SPEED 0.5
#define OUTER_ACCEL 1.0
#define INNER_ACCEL 2.0
#define COLOR vec3(1.0, 1.0, 1.0)

void mainImage( out vec4 fragColor, in vec2 fragCoord )
{
    vec2 p = (2.0*fragCoord.xy - iResolution.xy) / min(iResolution.x, iResolution.y);
    float r = length(p);
    float t = mod(iTime * SPEED, 1.0);
    float r2 = pow(t, OUTER_ACCEL);
    float r1 = pow(t, INNER_ACCEL);
    float region = smoothstep(r1-0.01, r1, r) - smoothstep(r2-0.01, r2, r); 
    fragColor = vec4(region * COLOR, 1.0);
}

哪个移植到 spritekit 着色器

void main(){
    
    float SPEED         = 0.5;
    float OUTER_ACCEL   = 1.0;
    float INNER_ACCEL   = 2.0;
    vec3 COLOR          = vec3(1.0, 1.0, 1.0);
    
    vec2 p   = (2.0*gl_FragCoord.xy - u_sprite_size.xy) / min(u_sprite_size.x, u_sprite_size.y);
    float r  = length(p);
    float t  = mod(u_time * SPEED, 1.0);
    float r2 = pow(t, OUTER_ACCEL);
    float r1 = pow(t, INNER_ACCEL);
    float region = smoothstep(r1-0.01, r1, r) - smoothstep(r2-0.01, r2, r);
    gl_FragColor = vec4(region * COLOR, 1.0);
}
 -------------

    let s = SKSpriteNode(color: .red, size: CGSize(width: 400, height: 400))
    addChild(s)
    s.shader = SKShader(fileNamed: "CartoonExplosion.fsh")
    
    let spriteSize = vector_float2(Float(s.frame.size.width),
                                   Float(s.frame.size.height))
    
    s.shader?.uniforms = [
        SKUniform(name: "u_sprite_size", vectorFloat2: spriteSize),
        SKUniform(name: "u_speed", float: 0)
    ]

但只显示一个黑色方块

编辑 2 我设法让它工作，但它缺乏另一个人的生活，看起来它更有活力

标签： openglsprite-kitshaderspritegame-development