Container issues: not defined and center pivot

I am pretty fresh on Phaser so I am completely at a lost.

This is my test code:

var config = {
    width: 800,
    height: 600,
    type: Phaser.AUTO,
    parent: 'test',
    scene: {
        create: create,
        update: update
    }
};

var game = new Phaser.Game(config);

function create ()
{
    var container = this.add.container(50, 50);
    var graphics = this.add.graphics();

    graphics.fillStyle(0x888888, 1);
    graphics.fillRect(0, 0, 20, 20);
    container.add(graphics);
    container.rotation = 0.1;
}

function update()
{
    container.y += 1;
}

First problem is that the container is not being recognized into the update function. The debugger says ‘container is not defined’. What am I missing here? Wasn’t it defined into the create function?

The second problem is about the rotation. I couldn’t find a way of set the CENTER of my container as the rotation pivot. Any idea?

Thanks!

  1. In JS var is scoped to the enclosing function, so you need
    var container;
    
    function create ()
    {
        var container = …
        …
    }
    
  2. Container’s pivot is always its own (0, 0). So just rearrange children around that.
1 Like

Thank you very much Samme!