Canvas texture

Introduction

Canvas texture stored in texture cache, built-in object of phaser.

  • Author: Richard Davey

Usage

Create canvas texture

var texture = scene.textures.createCanvas(key, width, height);

Get canvas element

var canvas = texture.getCanvas();
var context = texture.getContext();

Canvas api

Draw frame

texture.drawFrame(key, frame, x, y);

Clear

texture.clear();
texture.clear(x, y, width, height);

Refresh texture

texture.refresh();

Color

  • Set
    texture.setPixel(x, y, red, green, blue);
    // texture.setPixel(x, y, red, green, blue, alpha);
    
  • Get
    var color = texture.getPixel(x, y);
    // var color = texture.getPixel(x, y, color);
    
    var colors = texture.getPixels(x, y, width, height);
    
    • colors : [{x, y, color, alpha}, ...]

Image data

  • Set
    texture.putData(imageData, x, y);
    
  • Get
    var imageData = texture.getData(x, y, width, height);
    

Add frame

texture.add(name, sourceIndex, x, y, width, height);
  • name : The name of this Frame. The name is unique within the Texture.
  • sourceIndex : The index of the TextureSource that this Frame is a part of.
  • x : The x coordinate of the top-left of this Frame.
  • y : The y coordinate of the top-left of this Frame.
  • width : The width of this Frame.
  • height : The height of this Frame.