Skip to main content
Version: Phaser v4.0.0-rc.6

Blend

The Blend Filter Controller.

This filter controller manages the blend effect for a Camera.

A blend effect allows you to apply another texture to the view

using a specific blend mode.

This supports blend modes not otherwise available in WebGL.

A Blend effect is added to a Camera via the FilterList component:


const camera = this.cameras.main;

camera.filters.internal.addBlend();

camera.filters.external.addBlend();

Constructor

new Blend(camera, [texture], [blendMode], [amount], [color])

Parameters

nametypeoptionaldefaultdescription
cameraPhaser.Cameras.Scene2D.CameraNoThe camera that owns this filter.
texturestringYes"'__WHITE'"The texture to apply to the view.
blendModePhaser.BlendModesYes"Phaser.BlendModes.NORMAL"The blend mode to apply to the view.
amountnumberYes1The amount of the blend effect to apply to the view. At 0, the original image is preserved. At 1, the blend texture is fully applied. The expected range is 0 to 1, but you can go outside that range for different effects.
colorArray.<number>Yes"[1, 1, 1, 1]"The color to apply to the blend texture. Each value corresponds to a color channel in RGBA. The expected range is 0 to 1, but you can go outside that range for different effects.

Scope: static

Extends

Phaser.Filters.Controller

Source: src/filters/Blend.js#L10
Since: 4.0.0

Inherited Members

From Phaser.Filters.Controller:


Public Members

amount

amount: number

Description:

The amount of the blend effect to apply to the view.

At 0, the original image is preserved. At 1, the blend texture is fully applied.

Source: src/filters/Blend.js#L70
Since: 4.0.0


blendMode

blendMode: Phaser.BlendModes

Description:

The blend mode to apply to the view.

This supports blend modes not otherwise available in WebGL.

Source: src/filters/Blend.js#L59
Since: 4.0.0


color

color: Array.<number>

Description:

The color to apply to the blend texture.

Each value corresponds to a color channel in RGBA.

The expected range is 0 to 1, but you can go outside that range for different effects.

Source: src/filters/Blend.js#L81
Since: 4.0.0


glTexture

glTexture: Phaser.Renderer.WebGL.Wrappers.WebGLTextureWrapper

Description:

The underlying texture used for the mask.

Source: src/filters/Blend.js#L50
Since: 4.0.0


Inherited Methods

From Phaser.Filters.Controller:


Public Methods

setTexture

<instance> setTexture([texture])

Description:

Sets the texture used for the blend.

Parameters:

nametypeoptionaldefaultdescription
texturestringYes"'__WHITE'"The unique string-based key of the texture to use for displacement, which must exist in the Texture Manager.

Returns: Phaser.Filters.Blend - This Filter Controller.

Source: src/filters/Blend.js#L96
Since: 4.0.0