Preparing search index...

    Class ShaderEffect

    A simplified shader class for applying custom fragment effects to renderables. Only requires a fragment apply() function — the vertex shader, uniforms, and texture sampling boilerplate are handled automatically. In Canvas mode, the shader is silently disabled (all methods become no-ops).

    // create a grayscale effect
    mySprite.shader = new ShaderEffect(renderer, `
        vec4 apply(vec4 color, vec2 uv) {
            float gray = dot(color.rgb, vec3(0.299, 0.587, 0.114));
            return vec4(vec3(gray), color.a);
        }
    `);

    // create an effect with a custom uniform
    const pulse = new ShaderEffect(renderer, `
        uniform float uTime;
        vec4 apply(vec4 color, vec2 uv) {
            float brightness = 0.8 + 0.2 * sin(uTime * 3.0);
            return vec4(color.rgb * brightness, color.a);
        }
    `);
    mySprite.shader = pulse;
    // update the uniform each frame
    pulse.setUniform("uTime", time);
    Index

    Constructors

    constructor

    Properties

    enabled

    Methods

    destroy setUniform

    Constructors

    • Parameters

      • renderer: any

        the current renderer instance

      • fragmentBody: string

        GLSL code containing a vec4 apply(vec4 color, vec2 uv) function that receives the sampled pixel color and UV coordinates, and returns the modified color. You can declare additional uniform variables before the apply() function.

      • Optionalprecision: string

        float precision ('lowp', 'mediump' or 'highp')

      Returns ShaderEffect

    Properties

    enabled: boolean = false

    whether this effect is active (false in Canvas mode)

    Methods

    Settings

    Member Visibility

    On This Page

    Constructors
    Properties
    Methods