Filter

Hide inherited members:

show private members:

Phaser . FX . ColorMatrix

The ColorMatrix FX Controller.

This FX controller manages the color matrix effect for a Game Object.

The color matrix effect is a visual technique that involves manipulating the colors of an image or scene using a mathematical matrix. This process can adjust hue, saturation, brightness, and contrast, allowing developers to create various stylistic appearances or mood settings within the game. Common applications include simulating different lighting conditions, applying color filters, or achieving a specific visual style.

A ColorMatrix effect is added to a Game Object via the FX component:

const sprite = this.add.sprite();

sprite.preFX.addColorMatrix();
sprite.postFX.addColorMatrix();

Constructor:

new ColorMatrix(gameObject)

Parameters:

name	type	description
gameObject	Phaser.GameObjects.GameObject	A reference to the Game Object that has this fx.

Since: 3.60.0

Source: src/fx/ColorMatrix.js (Line 11)

Extends

Phaser.Display.ColorMatrix

Members

<private> _dirty: boolean

Description:

Is the ColorMatrix array dirty?

Type:

boolean

Inherited from: Phaser.Display.ColorMatrix#_dirty

Since: 3.50.0

Source: src/display/ColorMatrix.js (Line 50)

<private> _matrix: Float32Array

Description:

Internal ColorMatrix array.

Type:

Float32Array

Inherited from: Phaser.Display.ColorMatrix#_matrix

Since: 3.50.0

Source: src/display/ColorMatrix.js (Line 30)

active: boolean

Description:

Toggle this boolean to enable or disable this effect, without removing and adding it from the Game Object.

Type:

boolean

Since: 3.60.0

Source: src/fx/ColorMatrix.js (Line 68)

alpha: number

Description:

The value that determines how much of the original color is used when mixing the colors. A value between 0 (all original) and 1 (all final)

Type:

number

Inherited from: Phaser.Display.ColorMatrix#alpha

Since: 3.50.0

Source: src/display/ColorMatrix.js (Line 40)

<private> data: Float32Array

Description:

The matrix data as a Float32Array.

Returned by the getData method.

Type:

Float32Array

Inherited from: Phaser.Display.ColorMatrix#data

Since: 3.50.0

Source: src/display/ColorMatrix.js (Line 60)

gameObject: Phaser.GameObjects.GameObject

Description:

A reference to the Game Object that owns this effect.

Type:

Phaser.GameObjects.GameObject

Since: 3.60.0

Source: src/fx/ColorMatrix.js (Line 59)

type: number

Description:

The FX_CONST type of this effect.

Type:

number

Since: 3.60.0

Source: src/fx/ColorMatrix.js (Line 50)

Methods

blackWhite([multiply])

Description:

Sets this ColorMatrix to be black and white.

Parameters:

name	type	arguments	Default	description
multiply	boolean	<optional>	false	Multiply the resulting ColorMatrix (`true`), or set it (`false`) ?

Returns:

Description:

This ColorMatrix instance.

Type:

Phaser.FX.ColorMatrix

Inherited from: Phaser.Display.ColorMatrix#blackWhite

Since: 3.50.0

Source: src/display/ColorMatrix.js (Line 271)

brightness([value], [multiply])

Description:

Changes the brightness of this ColorMatrix by the given amount.

Parameters:

name	type	arguments	Default	description
value	number	<optional>	0	The amount of brightness to apply to this ColorMatrix. Between 0 (black) and 1.
multiply	boolean	<optional>	false	Multiply the resulting ColorMatrix (`true`), or set it (`false`) ?

Returns:

Description:

This ColorMatrix instance.

Type:

Phaser.FX.ColorMatrix

Inherited from: Phaser.Display.ColorMatrix#brightness

Since: 3.50.0

Source: src/display/ColorMatrix.js (Line 150)

brown([multiply])

Description:

Applies a brown tone to this ColorMatrix.

Parameters:

name	type	arguments	Default	description
multiply	boolean	<optional>	false	Multiply the resulting ColorMatrix (`true`), or set it (`false`) ?

Returns:

Description:

This ColorMatrix instance.

Type:

Phaser.FX.ColorMatrix

Inherited from: Phaser.Display.ColorMatrix#brown

Since: 3.50.0

Source: src/display/ColorMatrix.js (Line 407)

contrast([value], [multiply])

Description:

Change the contrast of this ColorMatrix by the amount given.

Parameters:

name	type	arguments	Default	description
value	number	<optional>	0	The amount of contrast to apply to this ColorMatrix.
multiply	boolean	<optional>	false	Multiply the resulting ColorMatrix (`true`), or set it (`false`) ?

Returns:

Description:

This ColorMatrix instance.

Type:

Phaser.FX.ColorMatrix

Inherited from: Phaser.Display.ColorMatrix#contrast

Since: 3.50.0

Source: src/display/ColorMatrix.js (Line 288)

desaturateLuminance([multiply])

Description:

Apply a desaturated luminance to this ColorMatrix.

Parameters:

name	type	arguments	Default	description
multiply	boolean	<optional>	false	Multiply the resulting ColorMatrix (`true`), or set it (`false`) ?

Returns:

Description:

This ColorMatrix instance.

Type:

Phaser.FX.ColorMatrix

Inherited from: Phaser.Display.ColorMatrix#desaturateLuminance

Since: 3.50.0

Source: src/display/ColorMatrix.js (Line 332)

getData()

Description:

Gets the ColorMatrix as a Float32Array.

Can be used directly as a 1fv shader uniform value.

Returns:

Description:

The ColorMatrix as a Float32Array.

Type:

Float32Array

Inherited from: Phaser.Display.ColorMatrix#getData

Since: 3.50.0

Source: src/display/ColorMatrix.js (Line 121)

grayscale([value], [multiply])

Description:

Sets this ColorMatrix to be grayscale.

Parameters:

name	type	arguments	Default	description
value	number	<optional>	1	The grayscale scale (0 is black).
multiply	boolean	<optional>	false	Multiply the resulting ColorMatrix (`true`), or set it (`false`) ?

Returns:

Description:

This ColorMatrix instance.

Type:

Phaser.FX.ColorMatrix

Inherited from: Phaser.Display.ColorMatrix#grayscale

Since: 3.50.0

Source: src/display/ColorMatrix.js (Line 252)

hue([rotation], [multiply])

Description:

Rotates the hues of this ColorMatrix by the value given.

Parameters:

name	type	arguments	Default	description
rotation	number	<optional>	0	The amount of hue rotation to apply to this ColorMatrix, in degrees.
multiply	boolean	<optional>	false	Multiply the resulting ColorMatrix (`true`), or set it (`false`) ?

Returns:

Description:

This ColorMatrix instance.

Type:

Phaser.FX.ColorMatrix

Inherited from: Phaser.Display.ColorMatrix#hue

Since: 3.50.0

Source: src/display/ColorMatrix.js (Line 220)

kodachrome([multiply])

Description:

Applies a kodachrome color effect to this ColorMatrix.

Parameters:

name	type	arguments	Default	description
multiply	boolean	<optional>	false	Multiply the resulting ColorMatrix (`true`), or set it (`false`) ?

Returns:

Description:

This ColorMatrix instance.

Type:

Phaser.FX.ColorMatrix

Inherited from: Phaser.Display.ColorMatrix#kodachrome

Since: 3.50.0

Source: src/display/ColorMatrix.js (Line 441)

lsd([multiply])

Description:

Applies a trippy color tone to this ColorMatrix.

Parameters:

name	type	arguments	Default	description
multiply	boolean	<optional>	false	Multiply the resulting ColorMatrix (`true`), or set it (`false`) ?

Returns:

Description:

This ColorMatrix instance.

Type:

Phaser.FX.ColorMatrix

Inherited from: Phaser.Display.ColorMatrix#lsd

Since: 3.50.0

Source: src/display/ColorMatrix.js (Line 390)

multiply(a, [multiply])

Description:

Multiplies the two given matrices.

Parameters:

name	type	arguments	Default	description
a	Array.<number>			The 5x4 array to multiply with ColorMatrix._matrix.
multiply	boolean	<optional>	false	Multiply the resulting ColorMatrix (`true`), or set it (`false`) ?

Returns:

Description:

This ColorMatrix instance.

Type:

Phaser.FX.ColorMatrix

Inherited from: Phaser.Display.ColorMatrix#multiply

Since: 3.50.0

Source: src/display/ColorMatrix.js (Line 509)

negative([multiply])

Description:

Converts this ColorMatrix to have negative values.

Parameters:

name	type	arguments	Default	description
multiply	boolean	<optional>	false	Multiply the resulting ColorMatrix (`true`), or set it (`false`) ?

Returns:

Description:

This ColorMatrix instance.

Type:

Phaser.FX.ColorMatrix

Inherited from: Phaser.Display.ColorMatrix#negative

Since: 3.50.0

Source: src/display/ColorMatrix.js (Line 315)

night([intensity], [multiply])

Description:

Applies a night vision tone to this ColorMatrix.

Parameters:

name	type	arguments	Default	description
intensity	number	<optional>	0.1	The intensity of this effect.
multiply	boolean	<optional>	false	Multiply the resulting ColorMatrix (`true`), or set it (`false`) ?

Returns:

Description:

This ColorMatrix instance.

Type:

Phaser.FX.ColorMatrix

Inherited from: Phaser.Display.ColorMatrix#night

Since: 3.50.0

Source: src/display/ColorMatrix.js (Line 366)

polaroid([multiply])

Description:

Applies a polaroid color effect to this ColorMatrix.

Parameters:

name	type	arguments	Default	description
multiply	boolean	<optional>	false	Multiply the resulting ColorMatrix (`true`), or set it (`false`) ?

Returns:

Description:

This ColorMatrix instance.

Type:

Phaser.FX.ColorMatrix

Inherited from: Phaser.Display.ColorMatrix#polaroid

Since: 3.50.0

Source: src/display/ColorMatrix.js (Line 475)

reset()

Description:

Resets the ColorMatrix to default values and also resets the alpha property back to 1.

Returns:

Description:

This ColorMatrix instance.

Type:

Phaser.FX.ColorMatrix

Inherited from: Phaser.Display.ColorMatrix#reset

Since: 3.50.0

Source: src/display/ColorMatrix.js (Line 94)

saturate([value], [multiply])

Description:

Changes the saturation of this ColorMatrix by the given amount.

Parameters:

name	type	arguments	Default	description
value	number	<optional>	0	The amount of saturation to apply to this ColorMatrix.
multiply	boolean	<optional>	false	Multiply the resulting ColorMatrix (`true`), or set it (`false`) ?