solved Is grid aligning of static physics objects correct?

[kurhlaa]

Hello,

I try to use GridAlign for static Arcade physics objects, but I get strange positions.

Code example, which you can run at https://labs.phaser.io/edit.html?src=src\games\firstgame\part10.js:

var config = {
    type: Phaser.AUTO,
    width: 800,
    height: 600,
    physics: {
        default: 'arcade',
        arcade: {
            gravity: { y: 200 },
            debug: true
        }
    },
    scene: {
        preload: preload,
        create: create,
        update: update
    }
};

var player;
var platforms;
var cursors;

var game = new Phaser.Game(config);

function preload ()
{
    this.load.image('sky', 'src/games/firstgame/assets/sky.png');
    this.load.image('ground', 'src/games/firstgame/assets/platform.png');
    this.load.spritesheet('dude', 'src/games/firstgame/assets/dude.png', { frameWidth: 32, frameHeight: 48 });
    this.load.spritesheet('diamonds', 'assets/sprites/diamonds32x24x5.png', { frameWidth: 32, frameHeight: 24 });
}

function create ()
{
    //  A simple background for our game
    this.add.image(400, 300, 'sky');

    //  The platforms group contains the ground and the 2 ledges we can jump on
    platforms = this.physics.add.staticGroup();
    platforms.create(400, 568, 'ground').setScale(2).refreshBody();
    platforms.create(600, 400, 'ground');
    platforms.create(50, 250, 'ground');
    platforms.create(750, 220, 'ground');

    // The player and its settings
    player = this.physics.add.sprite(100, 450, 'dude');
    player.setCollideWorldBounds(true);

    //  Our player animations, turning, walking left and walking right.
    this.anims.create({
        key: 'left',
        frames: this.anims.generateFrameNumbers('dude', { start: 0, end: 3 }),
        frameRate: 10,
        repeat: -1
    });

    this.anims.create({
        key: 'turn',
        frames: [ { key: 'dude', frame: 4 } ],
        frameRate: 20
    });

    this.anims.create({
        key: 'right',
        frames: this.anims.generateFrameNumbers('dude', { start: 5, end: 8 }),
        frameRate: 10,
        repeat: -1
    });

    //  Input Events
    cursors = this.input.keyboard.createCursorKeys();

    //  Collide the player and the stars with the platforms
    this.physics.add.collider(player, platforms);

    // STATIC ALIGNED GROUP
    var group2 = this.physics.add.staticGroup({
        key: 'diamonds',
        frame: [ 0, 1 ],
        frameQuantity: 2
    });

    Phaser.Actions.GridAlign(group2.getChildren(), {
        width: 3,
        height: 10,
        cellWidth: 32,
        cellHeight: 32,
        x: 100,
        y: 100
    });

    // DYNAMIC ALIGNED GROUP
    var group3 = this.physics.add.group({
        key: 'diamonds',
        frame: [ 0, 1 ],
        frameQuantity: 2
    });

    Phaser.Actions.GridAlign(group3.getChildren(), {
        width: 3,
        height: 10,
        cellWidth: 32,
        cellHeight: 32,
        x: 500,
        y: 100
    });

    this.physics.add.collider(player, group2);
    this.physics.add.collider(player, group3);
    this.physics.add.collider(platforms, group3);
}

function update ()
{
    if (cursors.left.isDown)
    {
        player.setVelocityX(-160);
        player.anims.play('left', true);
    }
    else if (cursors.right.isDown)
    {
        player.setVelocityX(160);
        player.anims.play('right', true);
    }
    else
    {
        player.setVelocityX(0);
        player.anims.play('turn');
    }

    if (cursors.up.isDown && player.body.touching.down)
    {
        player.setVelocityY(-330);
    }
}

Here strange is that all static objects (group2) position is 0x0 - you can see the debug layer in canvas top-left corner. You can also try to move a player there - images do not have collisions, but that rectangle in the corner does have.

If I create the same, but dynamic group (group3) - everything is Ok.

 

The question is should it be like that or static bodies are not being placed correctly by GridAlign ?

[rich]

After aligning the objects:

    //  We need to call this because placeOnRectangle has changed the coordinates of all the children
    //  If we don't call it, the static physics bodies won't be updated to reflect them
    group.refresh();

 

[kurhlaa]

So easy, thanks! refresh() must be called after any modification of static group/body?

[rich]

Yes, the whole point of a static body is that it’s static, so if you move it, you need to tell it you have.