phaser-framework Create And Add To Screen


You first must create a "Game" object in Phaser.

var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create });

In the preload callback function load the image.

function preload() {

    game.load.image('thing', 'assets/thing-image.png');

ParameterDetails (Game.add.image)
namethe name used to reference the image in the game.add.image method.
filepath to the asset file (relative to the root directory for the project.

Then in the create function use the "add" method of the game object to create the Image object and it to the screen.

function create() {

  var image = game.add.image(100, 100, 'thing');

ParameterDetails (Game.add.image)
xthe x coordinates where the image should be added.
ythe y coordinate where the image should be added.
namethe name of the image assigned in the game.load.image method.