You are browsing legacy Phaser documentation that is 4+ years out of date. Please see https://newdocs.phaser.io

Class: Fade

Phaser.Cameras.Scene2D.Effects. Fade

A Camera Fade effect.

This effect will fade the camera viewport to the given color, over the duration specified.

Only the camera viewport is faded. None of the objects it is displaying are impacted, i.e. their colors do not change.

The effect will dispatch several events on the Camera itself and you can also specify an onUpdate callback, which is invoked each frame for the duration of the effect, if required.

new Fade(camera)

Parameters:
Name Type Description
camera Phaser.Cameras.Scene2D.Camera

The camera this effect is acting upon.
Since: 3.5.0
Source: src/cameras/2d/effects/Fade.js (Line 11)

Members

<readonly> camera :Phaser.Cameras.Scene2D.Camera

The Camera this effect belongs to.

Type:
Since: 3.5.0
Source: src/cameras/2d/effects/Fade.js (Line 36)

<readonly> direction :boolean

The direction of the fade. true = fade out (transparent to color), false = fade in (color to transparent)

Type:
  • boolean
Since: 3.5.0
Source: src/cameras/2d/effects/Fade.js (Line 71)

<readonly> duration :number

The duration of the effect, in milliseconds.

Type:
  • number
Since: 3.5.0
Default Value:
  • 0
Source: src/cameras/2d/effects/Fade.js (Line 82)

<readonly> isComplete :boolean

Has this effect finished running?

This is different from isRunning because it remains set to true when the effect is over, until the effect is either reset or started again.

Type:
  • boolean
Since: 3.5.0
Default Value:
  • false
Source: src/cameras/2d/effects/Fade.js (Line 57)

<readonly> isRunning :boolean

Is this effect actively running?

Type:
  • boolean
Since: 3.5.0
Default Value:
  • false
Source: src/cameras/2d/effects/Fade.js (Line 46)

progress :number

If this effect is running this holds the current percentage of the progress, a value between 0 and 1.

Type:
  • number
Since: 3.5.0
Source: src/cameras/2d/effects/Fade.js (Line 137)

Methods

destroy()

Destroys this effect, releasing it from the Camera.

Since: 3.5.0
Source: src/cameras/2d/effects/Fade.js (Line 367)

effectComplete()

Called internally when the effect completes.

Since: 3.5.0
Source: src/cameras/2d/effects/Fade.js (Line 330)
Fires:

postRenderCanvas(ctx)

Called internally by the Canvas Renderer.

Parameters:
Name Type Description
ctx CanvasRenderingContext2D

The Canvas context to render to.
Since: 3.5.0
Source: src/cameras/2d/effects/Fade.js (Line 273)
Returns:

true if the effect drew to the renderer, otherwise false.

Type
boolean

postRenderWebGL(pipeline, getTintFunction)

Called internally by the WebGL Renderer.

Parameters:
Name Type Description
pipeline Phaser.Renderer.WebGL.Pipelines.MultiPipeline

The WebGL Pipeline to render to. Must provide the drawFillRect method.
getTintFunction function

A function that will return the gl safe tint colors.
Since: 3.5.0
Source: src/cameras/2d/effects/Fade.js (Line 298)
Returns:

true if the effect drew to the renderer, otherwise false.

Type
boolean

reset()

Resets this camera effect. If it was previously running, it stops instantly without calling its onComplete callback or emitting an event.

Since: 3.5.0
Source: src/cameras/2d/effects/Fade.js (Line 351)

start( [direction] [, duration] [, red] [, green] [, blue] [, force] [, callback] [, context])

Fades the Camera to or from the given color over the duration specified.

Parameters:
Name Type Argument Default Description
direction boolean <optional>
 true

The direction of the fade. true = fade out (transparent to color), false = fade in (color to transparent)
duration number <optional>
 1000

The duration of the effect in milliseconds.
red number <optional>
 0

The amount to fade the red channel towards. A value between 0 and 255.
green number <optional>
 0

The amount to fade the green channel towards. A value between 0 and 255.
blue number <optional>
 0

The amount to fade the blue channel towards. A value between 0 and 255.
force boolean <optional>
 false

Force the effect to start immediately, even if already running.
callback Phaser.Types.Cameras.Scene2D.CameraFadeCallback <optional>

This callback will be invoked every frame for the duration of the effect. It is sent two arguments: A reference to the camera and a progress amount between 0 and 1 indicating how complete the effect is.
context any <optional>

The context in which the callback is invoked. Defaults to the Scene to which the Camera belongs.
Since: 3.5.0
Source: src/cameras/2d/effects/Fade.js (Line 178)
Fires:
Returns:

The Camera on which the effect was started.

Type
Phaser.Cameras.Scene2D.Camera

update(time, delta)

The main update loop for this effect. Called automatically by the Camera.

Parameters:
Name Type Description
time number

The current timestamp as generated by the Request Animation Frame or SetTimeout.
delta number

The delta time, in ms, elapsed since the last frame.
Since: 3.5.0
Source: src/cameras/2d/effects/Fade.js (Line 237)