Phaser API Documentation

  Version: 
Filter
This is a beta release of our new docs system. Found an issue?
Please tell us about it in the #📖-newdocs-feedback channel on the Phaser Discord

Phaser . Textures . TextureManager

This is a beta release of our new docs system. Found an issue?
Please tell us about it in the #📖-newdocs-feedback channel on the Phaser Discord

Phaser . Textures . TextureManager

Textures are managed by the global TextureManager. This is a singleton class that is responsible for creating and delivering Textures and their corresponding Frames to Game Objects.

Sprites and other Game Objects get the texture data they need from the TextureManager.

Access it via scene.textures.

Constructor:

new TextureManager(game)

Parameters:

name type description
game Phaser.Game

The Phaser.Game instance this Texture Manager belongs to.

Since: 3.0.0

Extends


Members

<private> _pending: number
Focus
Focus

Description:

An counting value used for emitting 'ready' event after all of managers in game is loaded.

Type:
number
Default: 0
Since: 3.0.0
Focus
Focus
<private> _tempCanvas: HTMLCanvasElement
Focus
Focus

Description:

The temporary canvas element to save an pixel data of an arbitrary texture in getPixel() and getPixelAlpha() method.

Type:
HTMLCanvasElement
Since: 3.0.0
Focus
Focus
<private> _tempContext: CanvasRenderingContext2D
Focus
Focus

Description:

The context of the temporary canvas element made to save an pixel data in getPixel() and getPixelAlpha() method.

Type:
CanvasRenderingContext2D
Since: 3.0.0
Focus
Focus
game: Phaser.Game
Focus
Focus

Description:

The Game that this TextureManager belongs to.

Type:
Since: 3.0.0
Focus
Focus
list: object
Focus
Focus

Description:

An object that has all of textures that Texture Manager creates. Textures are assigned to keys so we can access to any texture that this object has directly by key value without iteration.

Type:
object
Default: {}
Since: 3.0.0
Focus
Focus
name: string
Focus
Focus

Description:

The name of this manager.

Type:
string
Since: 3.0.0
Focus
Focus

Methods

addAtlas(key, source, data, [dataSource])
Focus
Focus

Description:

Adds a new Texture Atlas to this Texture Manager. It can accept either JSON Array or JSON Hash formats, as exported by Texture Packer and similar software.

Parameters:

name type arguments description
key string

The unique string-based key of the Texture.

source HTMLImageElement

The source Image element.

data object

The Texture Atlas data.

dataSource HTMLImageElement | HTMLCanvasElement | Array.<HTMLImageElement> | Array.<HTMLCanvasElement> <optional>

An optional data Image element.

Returns:
Description:

The Texture that was created, or null if the key is already in use.

Examples:
Since: 3.0.0
Focus
Focus
addAtlasJSONArray(key, source, data, [dataSource])
Focus
Focus

Description:

Adds a Texture Atlas to this Texture Manager. The frame data of the atlas must be stored in an Array within the JSON. This is known as a JSON Array in software such as Texture Packer.

Parameters:

name type arguments description
key string

The unique string-based key of the Texture.

source HTMLImageElement | Array.<HTMLImageElement>

The source Image element/s.

data object | Array.<object>

The Texture Atlas data/s.

dataSource HTMLImageElement | HTMLCanvasElement | Array.<HTMLImageElement> | Array.<HTMLCanvasElement> <optional>

An optional data Image element.

Returns:
Description:

The Texture that was created, or null if the key is already in use.

Examples:
Since: 3.0.0
Focus
Focus
addAtlasJSONHash(key, source, data, [dataSource])
Focus
Focus

Description:

Adds a Texture Atlas to this Texture Manager. The frame data of the atlas must be stored in an Object within the JSON. This is known as a JSON Hash in software such as Texture Packer.

Parameters:

name type arguments description
key string

The unique string-based key of the Texture.

source HTMLImageElement

The source Image element.

data object

The Texture Atlas data.

dataSource HTMLImageElement | HTMLCanvasElement | Array.<HTMLImageElement> | Array.<HTMLCanvasElement> <optional>

An optional data Image element.

Returns:
Description:

The Texture that was created, or null if the key is already in use.

Examples:
Since: 3.0.0
Focus
Focus
addAtlasXML(key, source, data, [dataSource])
Focus
Focus

Description:

Adds a Texture Atlas to this Texture Manager, where the atlas data is given in the XML format.

Parameters:

name type arguments description
key string

The unique string-based key of the Texture.

source HTMLImageElement

The source Image element.

data object

The Texture Atlas XML data.

dataSource HTMLImageElement | HTMLCanvasElement | Array.<HTMLImageElement> | Array.<HTMLCanvasElement> <optional>

An optional data Image element.

Returns:
Description:

The Texture that was created, or null if the key is already in use.

Examples:
Since: 3.7.0
Focus
Focus
addBase64(key, data)
Focus
Focus

Description:

Adds a new Texture to the Texture Manager created from the given Base64 encoded data.

It works by creating an Image DOM object, then setting the src attribute to the given base64 encoded data. As a result, the process is asynchronous by its nature, so be sure to listen for the events this method dispatches before using the texture.

Parameters:

name type description
key string

The unique string-based key of the Texture.

data *

The Base64 encoded data.

Returns:
Description:

This Texture Manager instance.

Examples:
Since: 3.0.0
Focus
Focus
addCanvas(key, source, [skipCache])
Focus
Focus

Description:

Creates a new Canvas Texture object from an existing Canvas element and adds it to this Texture Manager, unless skipCache is true.

Parameters:

name type arguments Default description
key string

The unique string-based key of the Texture.

source HTMLCanvasElement

The Canvas element to form the base of the new Texture.

skipCache boolean <optional> false

Skip adding this Texture into the Cache?

Returns:
Description:

The Canvas Texture that was created, or null if the key is already in use.

Examples:
Since: 3.0.0
Focus
Focus
addGLTexture(key, glTexture, [width], [height])
Focus
Focus

Description:

Takes a WebGL Texture and creates a Phaser Texture from it, which is added to the Texture Manager using the given key.

This allows you to then use the Texture as a normal texture for texture based Game Objects like Sprites.

If the width and height arguments are omitted, but the WebGL Texture was created by Phaser's WebGL Renderer and has glTexture.width and glTexture.height properties, these values will be used instead.

This is a WebGL only feature.

Parameters:

name type arguments description
key string

The unique string-based key of the Texture.

glTexture WebGLTexture

The source Render Texture.

width number <optional>

The new width of the Texture. Read from glTexture.width if omitted.

height number <optional>

The new height of the Texture. Read from glTexture.height if omitted.

Returns:
Description:

The Texture that was created, or null if the key is already in use.

Examples:
Since: 3.19.0
Focus
Focus
addImage(key, source, [dataSource])
Focus
Focus

Description:

Adds a new Texture to the Texture Manager created from the given Image element.

Parameters:

name type arguments description
key string

The unique string-based key of the Texture.

source HTMLImageElement

The source Image element.

dataSource HTMLImageElement | HTMLCanvasElement <optional>

An optional data Image element.

Returns:
Description:

The Texture that was created, or null if the key is already in use.

Examples:
Since: 3.0.0
Focus
Focus
addListener(event, fn, [context])
Focus
Focus

Description:

Add a listener for a given event.

Parameters:

name type arguments Default description
event string | symbol

The event name.

fn function

The listener function.

context * <optional> this

The context to invoke the listener with.

Returns:
Description:

this.

Inherited from: Phaser.Events.EventEmitter#addListener
Examples:
Since: 3.0.0
Focus
Focus
addRenderTexture(key, renderTexture)
Focus
Focus

Description:

Adds a Render Texture to the Texture Manager using the given key. This allows you to then use the Render Texture as a normal texture for texture based Game Objects like Sprites.

Parameters:

name type description
key string

The unique string-based key of the Texture.

renderTexture Phaser.GameObjects.RenderTexture

The source Render Texture.

Returns:
Description:

The Texture that was created, or null if the key is already in use.

Examples:
Since: 3.12.0
Focus
Focus
addSpriteSheet(key, source, config)
Focus
Focus

Description:

Adds a Sprite Sheet to this Texture Manager.

In Phaser terminology a Sprite Sheet is a texture containing different frames, but each frame is the exact same size and cannot be trimmed or rotated.

Parameters:

name type description
key string

The unique string-based key of the Texture.

source HTMLImageElement

The source Image element.

config Phaser.Types.Textures.SpriteSheetConfig

The configuration object for this Sprite Sheet.

Returns:
Description:

The Texture that was created, or null if the key is already in use.

Examples:
Since: 3.0.0
Focus
Focus
addSpriteSheetFromAtlas(key, config)
Focus
Focus

Description:

Adds a Sprite Sheet to this Texture Manager, where the Sprite Sheet exists as a Frame within a Texture Atlas.

In Phaser terminology a Sprite Sheet is a texture containing different frames, but each frame is the exact same size and cannot be trimmed or rotated.

Parameters:

name type description
key string

The unique string-based key of the Texture.

config Phaser.Types.Textures.SpriteSheetFromAtlasConfig

The configuration object for this Sprite Sheet.

Returns:
Description:

The Texture that was created, or null if the key is already in use.

Examples:
Since: 3.0.0
Focus
Focus
addUnityAtlas(key, source, data, [dataSource])
Focus
Focus

Description:

Adds a Unity Texture Atlas to this Texture Manager. The data must be in the form of a Unity YAML file.

Parameters:

name type arguments description
key string

The unique string-based key of the Texture.

source HTMLImageElement

The source Image element.

data object

The Texture Atlas data.

dataSource HTMLImageElement | HTMLCanvasElement | Array.<HTMLImageElement> | Array.<HTMLCanvasElement> <optional>

An optional data Image element.

Returns:
Description:

The Texture that was created, or null if the key is already in use.

Examples:
Since: 3.0.0
Focus
Focus
<private> boot()
Focus
Focus

Description:

The Boot Handler called by Phaser.Game when it first starts up.

Examples:
Since: 3.0.0
Focus
Focus
checkKey(key)
Focus
Focus

Description:

Checks the given texture key and throws a console.warn if the key is already in use, then returns false. If you wish to avoid the console.warn then use TextureManager.exists instead.

Parameters:

name type description
key string

The texture key to check.

Returns:
Description:

true if it's safe to use the texture key, otherwise false.

Type:
  • boolean
Examples:
Since: 3.7.0
Focus
Focus
cloneFrame(key, frame)
Focus
Focus

Description:

Takes a Texture key and Frame name and returns a clone of that Frame if found.

Parameters:

name type description
key string

The unique string-based key of the Texture.

frame string | number

The string or index of the Frame to be cloned.

Returns:
Description:

A Clone of the given Frame.

Examples:
Since: 3.0.0
Focus
Focus
create(key, source, width, height)
Focus
Focus

Description:

Creates a new Texture using the given source and dimensions.

Parameters:

name type description
key string

The unique string-based key of the Texture.

source HTMLImageElement

The source Image element.

width number

The width of the Texture.

height number

The height of the Texture.

Returns:
Description:

The Texture that was created, or null if the key is already in use.

Examples:
Since: 3.0.0
Focus
Focus
createCanvas(key, [width], [height])
Focus
Focus

Description:

Creates a new Texture using a blank Canvas element of the size given.

Canvas elements are automatically pooled and calling this method will extract a free canvas from the CanvasPool, or create one if none are available.

Parameters:

name type arguments Default description
key string

The unique string-based key of the Texture.

width number <optional> 256

The width of the Canvas element.

height number <optional> 256

The height of the Canvas element.

Returns:
Description:

The Canvas Texture that was created, or null if the key is already in use.

Examples:
Since: 3.0.0
Focus
Focus
destroy()
Focus
Focus

Description:

Destroys the Texture Manager and all Textures stored within it.

Overrides: Phaser.Events.EventEmitter#destroy
Examples:
Since: 3.0.0
Focus
Focus
each(callback, scope, [args])
Focus
Focus

Description:

Passes all Textures to the given callback.

Parameters:

name type arguments description
callback EachTextureCallback

The callback function to be sent the Textures.

scope object

The value to use as this when executing the callback.

args * <optional>

Additional arguments that will be passed to the callback, after the child.

Examples:
Since: 3.0.0
Focus
Focus
emit(event, [args])
Focus
Focus

Description:

Calls each of the listeners registered for a given event.

Parameters:

name type arguments description
event string | symbol

The event name.

args * <optional>

Additional arguments that will be passed to the event handler.

Returns:
Description:

true if the event had listeners, else false.

Type:
  • boolean
Inherited from: Phaser.Events.EventEmitter#emit
Examples:
Since: 3.0.0
Focus
Focus
eventNames()
Focus
Focus

Description:

Return an array listing the events for which the emitter has registered listeners.

Type:
  • Array.<(string
  • symbol)>
Inherited from: Phaser.Events.EventEmitter#eventNames
Examples:
Since: 3.0.0
Focus
Focus
exists(key)
Focus
Focus

Description:

Checks the given key to see if a Texture using it exists within this Texture Manager.

Parameters:

name type description
key string

The unique string-based key of the Texture.

Returns:
Description:

Returns true if a Texture matching the given key exists in this Texture Manager.

Type:
  • boolean
Examples:
Since: 3.0.0
Focus
Focus
generate(key, config)
Focus
Focus

Description:

Creates a new Texture using the given config values.

Generated textures consist of a Canvas element to which the texture data is drawn.

Generates a texture based on the given Create configuration object.

The texture is drawn using a fixed-size indexed palette of 16 colors, where the hex value in the data cells map to a single color. For example, if the texture config looked like this:

var star = [
  '.....828.....',
  '....72227....',
  '....82228....',
  '...7222227...',
  '2222222222222',
  '8222222222228',
  '.72222222227.',
  '..787777787..',
  '..877777778..',
  '.78778887787.',
  '.27887.78872.',
  '.787.....787.'
];

this.textures.generate('star', { data: star, pixelWidth: 4 });

Then it would generate a texture that is 52 x 48 pixels in size, because each cell of the data array represents 1 pixel multiplied by the pixelWidth value. The cell values, such as 8, maps to color number 8 in the palette. If a cell contains a period character . then it is transparent.

The default palette is Arne16, but you can specify your own using the palette property.

Parameters:

name type description
key string

The unique string-based key of the Texture.

config Phaser.Types.Create.GenerateTextureConfig

The configuration object needed to generate the texture.

Returns:
Description:

The Texture that was created, or null if the key is already in use.

Examples:
Since: 3.0.0
Focus
Focus
get(key)
Focus
Focus

Description:

Returns a Texture from the Texture Manager that matches the given key.

If the key is undefined it will return the __DEFAULT Texture.

If the key is an instance of a Texture, it will return the key directly.

Finally. if the key is given, but not found and not a Texture instance, it will return the __MISSING Texture.

Parameters:

name type description
key string | Phaser.Textures.Texture

The unique string-based key of the Texture, or a Texture instance.

Returns:
Description:

The Texture that was created.

Examples:
Since: 3.0.0
Focus
Focus
getBase64(key, [frame], [type], [encoderOptions])
Focus
Focus

Description:

Gets an existing texture frame and converts it into a base64 encoded image and returns the base64 data.

You can also provide the image type and encoder options.

This will only work with bitmap based texture frames, such as those created from Texture Atlases. It will not work with GL Texture objects, such as Shaders, or Render Textures. For those please see the WebGL Snapshot function instead.

Parameters:

name type arguments Default description
key string

The unique string-based key of the Texture.

frame string | number <optional>

The string-based name, or integer based index, of the Frame to get from the Texture.

type string <optional> 'image/png'

A DOMString indicating the image format. The default format type is image/png.

encoderOptions number <optional> 0.92

A Number between 0 and 1 indicating the image quality to use for image formats that use lossy compression such as image/jpeg and image/webp. If this argument is anything else, the default value for image quality is used. The default value is 0.92. Other arguments are ignored.

Returns:
Description:

The base64 encoded data, or an empty string if the texture frame could not be found.

Type:
  • string
Examples:
Since: 3.12.0
Focus
Focus
getFrame(key, [frame])
Focus
Focus

Description:

Takes a Texture key and Frame name and returns a reference to that Frame, if found.

Parameters:

name type arguments description
key string

The unique string-based key of the Texture.

frame string | number <optional>

The string-based name, or integer based index, of the Frame to get from the Texture.

Returns:
Description:

A Texture Frame object.

Examples:
Since: 3.0.0
Focus
Focus
getPixel(x, y, key, [frame])
Focus
Focus

Description:

Given a Texture and an x and y coordinate this method will return a new Color object that has been populated with the color and alpha values of the pixel at that location in the Texture.

Parameters:

name type arguments description
x number

The x coordinate of the pixel within the Texture.

y number

The y coordinate of the pixel within the Texture.

key string

The unique string-based key of the Texture.

frame string | number <optional>

The string or index of the Frame.

Returns:
Description:

A Color object populated with the color values of the requested pixel, or null if the coordinates were out of bounds.

Examples:
Since: 3.0.0
Focus
Focus
getPixelAlpha(x, y, key, [frame])
Focus
Focus

Description:

Given a Texture and an x and y coordinate this method will return a value between 0 and 255 corresponding to the alpha value of the pixel at that location in the Texture. If the coordinate is out of bounds it will return null.

Parameters:

name type arguments description
x number

The x coordinate of the pixel within the Texture.

y number

The y coordinate of the pixel within the Texture.

key string

The unique string-based key of the Texture.

frame string | number <optional>

The string or index of the Frame.

Returns:
Description:

A value between 0 and 255, or null if the coordinates were out of bounds.

Type:
  • number
Examples:
Since: 3.10.0
Focus
Focus
getTextureKeys()
Focus
Focus

Description:

Returns an array with all of the keys of all Textures in this Texture Manager. The output array will exclude the __DEFAULT and __MISSING keys.

Returns:
Description:

An array containing all of the Texture keys stored in this Texture Manager.

Type:
  • Array.
Examples:
Since: 3.0.0
Focus
Focus
listenerCount(event)
Focus
Focus

Description:

Return the number of listeners listening to a given event.

Parameters:

name type description
event string | symbol

The event name.

Returns:
Description:

The number of listeners.

Type:
  • number
Inherited from: Phaser.Events.EventEmitter#listenerCount
Examples:
Since: 3.0.0
Focus
Focus
listeners(event)
Focus
Focus

Description:

Return the listeners registered for a given event.

Parameters:

name type description
event string | symbol

The event name.

Returns:
Description:

The registered listeners.

Type:
  • Array.
Inherited from: Phaser.Events.EventEmitter#listeners
Examples:
Since: 3.0.0
Focus
Focus
off(event, [fn], [context], [once])
Focus
Focus

Description:

Remove the listeners of a given event.

Parameters:

name type arguments description
event string | symbol

The event name.

fn function <optional>

Only remove the listeners that match this function.

context * <optional>

Only remove the listeners that have this context.

once boolean <optional>

Only remove one-time listeners.

Returns:
Description:

this.

Inherited from: Phaser.Events.EventEmitter#off
Examples:
Since: 3.0.0
Focus
Focus
on(event, fn, [context])
Focus
Focus

Description:

Add a listener for a given event.

Parameters:

name type arguments Default description
event string | symbol

The event name.

fn function

The listener function.

context * <optional> this

The context to invoke the listener with.

Returns:
Description:

this.

Inherited from: Phaser.Events.EventEmitter#on
Examples:
Since: 3.0.0
Focus
Focus
once(event, fn, [context])
Focus
Focus

Description:

Add a one-time listener for a given event.

Parameters:

name type arguments Default description
event string | symbol

The event name.

fn function

The listener function.

context * <optional> this

The context to invoke the listener with.

Returns:
Description:

this.

Inherited from: Phaser.Events.EventEmitter#once
Examples:
Since: 3.0.0
Focus
Focus
remove(key)
Focus
Focus

Description:

Removes a Texture from the Texture Manager and destroys it. This will immediately clear all references to it from the Texture Manager, and if it has one, destroy its WebGLTexture. This will emit a removetexture event.

Note: If you have any Game Objects still using this texture they will start throwing errors the next time they try to render. Make sure that removing the texture is the final step when clearing down to avoid this.

Parameters:

name type description
key string | Phaser.Textures.Texture

The key of the Texture to remove, or a reference to it.

Returns:
Description:

The Texture Manager.

Examples:
Since: 3.7.0
Focus
Focus
removeAllListeners([event])
Focus
Focus

Description:

Remove all listeners, or those of the specified event.

Parameters:

name type arguments description
event string | symbol <optional>

The event name.

Returns:
Description:

this.

Inherited from: Phaser.Events.EventEmitter#removeAllListeners
Examples:
Since: 3.0.0
Focus
Focus
removeKey(key)
Focus
Focus

Description:

Removes a key from the Texture Manager but does not destroy the Texture that was using the key.

Parameters:

name type description
key string

The key to remove from the texture list.

Returns:
Description:

The Texture Manager.

Examples:
Since: 3.17.0
Focus
Focus
removeListener(event, [fn], [context], [once])
Focus
Focus

Description:

Remove the listeners of a given event.

Parameters:

name type arguments description
event string | symbol

The event name.

fn function <optional>

Only remove the listeners that match this function.

context * <optional>

Only remove the listeners that have this context.

once boolean <optional>

Only remove one-time listeners.

Returns:
Description:

this.

Inherited from: Phaser.Events.EventEmitter#removeListener
Examples:
Since: 3.0.0
Focus
Focus
renameTexture(currentKey, newKey)
Focus
Focus

Description:

Changes the key being used by a Texture to the new key provided.

The old key is removed, allowing it to be re-used.

Game Objects are linked to Textures by a reference to the Texture object, so all existing references will be retained.

Parameters:

name type description
currentKey string

The current string-based key of the Texture you wish to rename.

newKey string

The new unique string-based key to use for the Texture.

Returns:
Description:

true if the Texture key was successfully renamed, otherwise false.

Type:
  • boolean
Examples:
Since: 3.12.0
Focus
Focus
setTexture(gameObject, key, [frame])
Focus
Focus

Description:

Sets the given Game Objects texture and frame properties so that it uses the Texture and Frame specified in the key and frame arguments to this method.

Parameters:

name type arguments description
gameObject Phaser.GameObjects.GameObject

The Game Object the texture would be set on.

key string

The unique string-based key of the Texture.

frame string | number <optional>

The string or index of the Frame.

Returns:
Description:

The Game Object the texture was set on.

Examples:
Since: 3.0.0
Focus
Focus
shutdown()
Focus
Focus

Description:

Removes all listeners.

Inherited from: Phaser.Events.EventEmitter#shutdown
Examples:
Since: 3.0.0
Focus
Focus
<private> updatePending()
Focus
Focus

Description:

After 'onload' or 'onerror' invoked twice, emit 'ready' event.

Examples:
Since: 3.0.0
Focus
Focus