PIXI.FilterSystem

class FilterSystem implements PIXI.ISystem

System plugin to the renderer to manage filters.

Pipeline

The FilterSystem executes the filtering pipeline by rendering the display-object into a texture, applying its filters in series, and the last filter outputs into the final render-target.

The filter-frame is the rectangle in world space being filtered, and those contents are mapped into (0, 0, filterFrame.width, filterFrame.height) into the filter render-texture. The filter-frame is also called the source-frame, as it is used to bind the filter render-textures. The last filter outputs to the filterFrame in the final render-target.

Usage

PIXI.Container#renderAdvanced is an example of how to use the filter system. It is a 3 step process:

push: Use PIXI.FilterSystem#push to push the set of filters to be applied on a filter-target. render: Render the contents to be filtered using the renderer. The filter-system will only capture the contents inside the bounds of the filter-target. NOTE: Using PIXI.Renderer#render is illegal during an existing render cycle, and it may reset the filter system. pop: Use PIXI.FilterSystem#pop to pop & execute the filters you initially pushed. It will apply them serially and output to the bounds of the filter-target.

Constructor

new PIXI.FilterSystem(renderer: PIXI.Renderer) → {}

Parameters:
Name	Type	Description
renderer	PIXI.Renderer	The renderer this System works for.

Summary

Properties from FilterSystem

Array<object>	defaultFilterStack
boolean	forceClear Whether to clear output renderTexture in AUTO/BLIT mode. See PIXI.CLEAR_MODES.
Array<FilterState>	statePool A pool for storing filter states, save us creating new ones each tick.
PIXI.RenderTexturePool	texturePool Stores a bunch of POT textures used for filtering.
boolean	useMaxPadding = false
object	protected activeState
PIXI.UniformGroup	protected globalUniforms
PIXI.Quad	protected quad A very simple geometry used when drawing a filter effect to the screen.
PIXI.QuadUv	protected quadUv Quad UVs

Methods from FilterSystem

void	applyFilter(filter: PIXI.Filter, input: PIXI.RenderTexture, output: PIXI.RenderTexture, clearMode: PIXI.CLEAR_MODES) Draws a filter using the default rendering process.
void	bindAndClear(filterTexture: PIXI.RenderTexture, clearMode: PIXI.CLEAR_MODES)
PIXI.Matrix	calculateSpriteMatrix(outputMatrix: PIXI.Matrix, sprite: PIXI.Sprite) Multiply input normalized coordinates to this matrix to get sprite texture normalized coordinates.
void	destroy() Destroys this Filter System.
void	emptyPool() Empties the texture pool.
PIXI.RenderTexture	getFilterTexture(input: PIXI.RenderTexture, resolution: number, multisample: PIXI.MSAA_QUALITY)
void	pop() Pops off the filter and applies it.
void	push(target: PIXI.DisplayObject, filters: Array<PIXI.Filter>)
void	resize() Calls `texturePool.resize()`, affects fullScreen renderTextures.
void	returnFilterTexture(renderTexture: PIXI.RenderTexture)
PIXI.RenderTexture	protected getOptimalFilterTexture(minWidth: number, minHeight: number, resolution: number, multisample: PIXI.MSAA_QUALITY)

Public Properties

defaultFilterStack FilterSystem.ts:46

defaultFilterStack: Array<object>

List of filters for the FilterSystem

forceClear FilterSystem.ts:58

forceClear: boolean

Whether to clear output renderTexture in AUTO/BLIT mode. See PIXI.CLEAR_MODES.

statePool FilterSystem.ts:52

statePool: Array<FilterState>

A pool for storing filter states, save us creating new ones each tick.

texturePool FilterSystem.ts:55

texturePool: PIXI.RenderTexturePool

Stores a bunch of POT textures used for filtering.

useMaxPadding FilterSystem.ts:61

useMaxPadding: boolean = false

Old padding behavior is to use the max amount instead of sum padding. Use this flag if you need the old behavior.

Protected Properties

activeState FilterSystem.ts:74

protected activeState: object

Active state

globalUniforms FilterSystem.ts:80

protected globalUniforms: PIXI.UniformGroup

This uniform group is attached to filter uniforms when used.

Properties:
Name	Type	Description
filterArea	Float32Array
filterClamp	Float32Array
inputClamp	Float32Array
inputPixel	Float32Array
inputSize	Float32Array
outputFrame	PIXI.Rectangle
resolution	number

quad FilterSystem.ts:68

protected quad: PIXI.Quad

A very simple geometry used when drawing a filter effect to the screen.

quadUv FilterSystem.ts:71

protected quadUv: PIXI.QuadUv

Quad UVs

Public Methods

applyFilter FilterSystem.ts:419

applyFilter(filter: PIXI.Filter, input: PIXI.RenderTexture, output: PIXI.RenderTexture, clearMode: PIXI.CLEAR_MODES) → {void}

Draws a filter using the default rendering process.

This should be called only by Filter#apply.

Parameters:
Name	Type	Attributes	Description
filter	PIXI.Filter		The filter to draw.
input	PIXI.RenderTexture		The input render target.
output	PIXI.RenderTexture		The target to output to.
clearMode	PIXI.CLEAR_MODES	<optional>	Should the output be cleared before rendering to it

Returns:
Type	Description
void

bindAndClear FilterSystem.ts:357

bindAndClear(filterTexture: PIXI.RenderTexture, clearMode: PIXI.CLEAR_MODES) → {void}

Binds a renderTexture with corresponding filterFrame, clears it if mode corresponds.

Parameters:
Name	Type	Description
filterTexture	PIXI.RenderTexture	renderTexture to bind, should belong to filter pool or filter stack
clearMode	PIXI.CLEAR_MODES	clearMode, by default its CLEAR/YES. See PIXI.CLEAR_MODES

Returns:
Type	Description
void

calculateSpriteMatrix FilterSystem.ts:462

calculateSpriteMatrix(outputMatrix: PIXI.Matrix, sprite: PIXI.Sprite) → {PIXI.Matrix}

Multiply input normalized coordinates to this matrix to get sprite texture normalized coordinates.

Use outputMatrix * vTextureCoord in the shader.

Parameters:
Name	Type	Description
outputMatrix	PIXI.Matrix	The matrix to output to.
sprite	PIXI.Sprite	The sprite to map to.

Returns:
Type	Description
PIXI.Matrix	The mapped matrix.

destroy FilterSystem.ts:486

destroy() → {void}

Destroys this Filter System.

Returns:
Type	Description
void

emptyPool FilterSystem.ts:545

emptyPool() → {void}

Empties the texture pool.

Returns:
Type	Description
void

getFilterTexture FilterSystem.ts:509

getFilterTexture(input: PIXI.RenderTexture, resolution: number, multisample: PIXI.MSAA_QUALITY) → {PIXI.RenderTexture}

Gets extra render texture to use inside current filter To be compliant with older filters, you can use params in any order

Parameters:
Name	Type	Attributes	Description
input	PIXI.RenderTexture	<optional>	renderTexture from which size and resolution will be copied
resolution	number	<optional>	override resolution of the renderTexture
multisample	PIXI.MSAA_QUALITY	<optional>	number of samples of the renderTexture

Returns:
Type	Description
PIXI.RenderTexture

pop FilterSystem.ts:248

pop() → {void}

Pops off the filter and applies it.

Returns:
Type	Description
void

push FilterSystem.ts:130

push(target: PIXI.DisplayObject, filters: Array<PIXI.Filter>) → {void}

Pushes a set of filters to be applied later to the system. This will redirect further rendering into an input render-texture for the rest of the filtering pipeline.

Parameters:
Name	Type	Description
target	PIXI.DisplayObject	The target of the filter to render.
filters	Array<PIXI.Filter>	The filters to apply.

Returns:
Type	Description
void

resize FilterSystem.ts:551

resize() → {void}

Calls texturePool.resize(), affects fullScreen renderTextures.

Returns:
Type	Description
void

returnFilterTexture FilterSystem.ts:536

returnFilterTexture(renderTexture: PIXI.RenderTexture) → {void}

Frees a render texture back into the pool.

Parameters:
Name	Type	Description
renderTexture	PIXI.RenderTexture	The renderTarget to free

Returns:
Type	Description
void

Protected Methods

getOptimalFilterTexture FilterSystem.ts:495

protected getOptimalFilterTexture(minWidth: number, minHeight: number, resolution: number, multisample: PIXI.MSAA_QUALITY) → {PIXI.RenderTexture}

Gets a Power-of-Two render texture or fullScreen texture

Parameters:
Name	Type	Default	Description
minWidth	number		The minimum width of the render texture in real pixels.
minHeight	number		The minimum height of the render texture in real pixels.
resolution	number	1	The resolution of the render texture.
multisample	PIXI.MSAA_QUALITY		Number of samples of the render texture.

Returns:
Type	Description
PIXI.RenderTexture	The new render texture.