melonJS
    Preparing search index...

    Class PixelateTransitionEffect

    A camera effect that performs a pixelate scene transition: the frame breaks up into blocks that grow to size pixels (hide), or shrink from size back to the sharp frame (reveal).

    It works on what the camera draws, through a PixelateEffect it puts FIRST in the camera's post-effect chain for as long as it runs, so the effects after it (a vignette, scanlines) stay sharp over the blocks. That is a shader, so on the Canvas renderer the effect does nothing: it adds no shader to the camera and only keeps its timing, and state.transition skips a pixelate transition there altogether.

    // break the screen up into 32 pixel blocks over 300ms
    camera.addCameraEffect(new PixelateTransitionEffect(camera, {
        renderer: app.renderer,
        size: 32,
        duration: 300,
        direction: "hide",
    }));

    Hierarchy (View Summary)

    Index
    constructor
    camera direction effect isComplete isPersistent onComplete progress size tween
    destroy draw update

    • Parameters

      • camera: Camera2d

        the camera to apply the effect to

      • options: {
            direction?: "hide" | "reveal";
            duration?: number;
            onComplete?: () => void;
            renderer: Renderer;
            size?: number;
        }

        effect options

        • Optionaldirection?: "hide" | "reveal"

          "hide" to break the frame up, "reveal" to bring it back

        • Optionalduration?: number

          expressed in milliseconds

        • OptionalonComplete?: () => void

          callback once the effect is over

        • renderer: Renderer

          the renderer drawing the camera

        • Optionalsize?: number

          the largest blocks, in screen pixels

      Returns PixelateTransitionEffect

    camera: Camera2d

    the camera this effect is attached to

    direction: "hide" | "reveal"
    effect: PixelateEffect | undefined

    the shader effect this transition drives on the camera, or undefined on a renderer without shaders (Canvas)

    isComplete: boolean

    whether this effect has finished and should be removed

    isPersistent: boolean

    whether this effect should persist across camera/game resets (e.g. transition effects that span state changes)

    false
    onComplete: (() => void) | undefined
    progress: { value: number }

    the transition progress, 0 for the sharp frame and 1 for the largest blocks

    size: number

    the largest blocks, at the end of a hide and the start of a reveal, in screen pixels

    tween: Tween

    Settings
    Member Visibility

    On This Page
    Constructors
    Properties
    Methods