PIXI.Application

class Application

Convenience class to create a new PIXI application.

This class automatically creates the renderer, ticker and root container.


 // Create the application
 const app = new PIXI.Application();

 // Add the view to the DOM
 document.body.appendChild(app.view);

 // ex, add display objects
 app.stage.addChild(PIXI.Sprite.from('something.png'));

Constructor

new PIXI.Application(options: object) → {}

Parameters:
Name	Type	Attributes	Default	Description
options	object	<optional>		The optional renderer parameters.
options.autoStart	boolean	<optional>	true	Automatically starts the rendering after the construction. Note: Setting this parameter to false does NOT stop the shared ticker even if you set options.sharedTicker to true in case that it is already started. Stop it by your own.
options.width	number	<optional>	800	The width of the renderers view.
options.height	number	<optional>	600	The height of the renderers view.
options.view	HTMLCanvasElement	<optional>		The canvas to use as a view, optional.
options.useContextAlpha	boolean	<optional>	true	Pass-through value for canvas' context `alpha` property. If you want to set transparency, please use `backgroundAlpha`. This option is for cases where the canvas needs to be opaque, possibly for performance reasons on some older devices.
options.autoDensity	boolean	<optional>	false	Resizes renderer view in CSS pixels to allow for resolutions other than 1.
options.antialias	boolean	<optional>	false	Sets antialias
options.preserveDrawingBuffer	boolean	<optional>	false	Enables drawing buffer preservation, enable this if you need to call toDataUrl on the WebGL context.
options.resolution	number	<optional>	PIXI.settings.RESOLUTION	The resolution / device pixel ratio of the renderer.
options.forceCanvas	boolean	<optional>	false	prevents selection of WebGL renderer, even if such is present, this option only is available when using pixi.js-legacy or @pixi/canvas-renderer modules, otherwise it is ignored.
options.backgroundColor	number	<optional>	0x000000	The background color of the rendered area (shown if not transparent).
options.backgroundAlpha	number	<optional>	1	Value from 0 (fully transparent) to 1 (fully opaque).
options.clearBeforeRender	boolean	<optional>	true	This sets if the renderer will clear the canvas or not before the new render pass.
options.powerPreference	string	<optional>		Parameter passed to webgl context, set to "high-performance" for devices with dual graphics card. (WebGL only).
options.sharedTicker	boolean	<optional>	false	`true` to use PIXI.Ticker.shared, `false` to create new ticker. If set to false, you cannot register a handler to occur before anything that runs on the shared ticker. The system ticker will always run before both the shared ticker and the app ticker.
options.sharedLoader	boolean	<optional>	false	`true` to use PIXI.Loader.shared, `false` to create new Loader.
options.resizeTo	Window \| HTMLElement	<optional>		Element to automatically resize stage to.

Summary

Properties from Application

PIXI.IApplicationPlugin[]	static _plugins Collection of installed plugins.
PIXI.Loader	loader
PIXI.Renderer \| PIXI.CanvasRenderer	renderer
Window \| HTMLElement	resizeTo
PIXI.Rectangle	screen
PIXI.Container	stage
PIXI.Ticker	ticker = PIXI.Ticker.shared
HTMLCanvasElement	view

Methods from Application

void	static registerPlugin(plugin: PIXI.IApplicationPlugin)
void	destroy(removeView: boolean, stageOptions: object \| boolean)
void	render() Render the current stage.
void	resize()
void	start()
void	stop()

Public Properties

_plugins Application.ts:49

static _plugins: PIXI.IApplicationPlugin[]

Collection of installed plugins.

loader AppLoaderPlugin.ts:19

loader: PIXI.Loader

Loader instance to help with asset loading.

renderer Application.ts:58

renderer: PIXI.Renderer | PIXI.CanvasRenderer

WebGL renderer if available, otherwise CanvasRenderer.

resizeTo ResizePlugin.ts:34

resizeTo: Window | HTMLElement

The HTML element or window to automatically resize the renderer's view element to match width and height.

screen Application.ts:146

screen: PIXI.Rectangle

Reference to the renderer's screen rectangle. Its safe to use as filterArea or hitArea for the whole screen.

stage Application.ts:52

stage: PIXI.Container

The root display container that's rendered.

ticker TickerPlugin.ts:92

ticker: PIXI.Ticker = PIXI.Ticker.shared

Ticker for doing render updates.

view Application.ts:136

view: HTMLCanvasElement

Reference to the renderer's canvas element.

Public Methods

registerPlugin Application.ts:113

static registerPlugin(plugin: PIXI.IApplicationPlugin) → {void}

Deprecated: since 6.5.0

Use the PIXI.extensions.add API to register plugins.

Parameters:
Name	Type	Description
plugin	PIXI.IApplicationPlugin	Plugin being installed

Returns:
Type	Description
void

destroy Application.ts:156

destroy(removeView: boolean, stageOptions: object | boolean) → {void}

Destroy and don't use after this.

Parameters:
Name	Type	Attributes	Default	Description
removeView	boolean	<optional>	false	Automatically remove canvas from DOM.
stageOptions	object \| boolean	<optional>		Options parameter. A boolean will act as if all options have been set to that value
stageOptions.children	boolean	<optional>	false	if set to true, all the children will have their destroy method called as well. 'stageOptions' will be passed on to those calls.
stageOptions.texture	boolean	<optional>	false	Only used for child Sprites if stageOptions.children is set to true. Should it destroy the texture of the child sprite
stageOptions.baseTexture	boolean	<optional>	false	Only used for child Sprites if stageOptions.children is set to true. Should it destroy the base texture of the child sprite

Returns:
Type	Description
void

render Application.ts:130

render() → {void}

Render the current stage.

Returns:
Type	Description
void

resize ResizePlugin.ts:93

resize() → {void}

Execute an immediate resize on the renderer, this is not throttled and can be expensive to call many times in a row. Will resize only if resizeTo property is set.

Returns:
Type	Description
void

start TickerPlugin.ts:72

start() → {void}

Convenience method for starting the render.

Returns:
Type	Description
void

stop TickerPlugin.ts:61

stop() → {void}

Convenience method for stopping the render.

Returns:
Type	Description
void