Collision box after resize body

Phaser 3
1

Hello.

I’m using Phaser 3 and the official example from the website. The same sprites and the same platforms.

The platforms are created with the method staticGroup()

platforms = this.physics.add.staticGroup();

And I’m storing one of those rigs in a variable so I can manipulate its properties:

var test_platform = platforms.create(100, 100, 'ground');

To modify the height and width, I am using these properties:


test_platform.displayHeight = 100;

test_platform.displayWidth = 100;

To modify the collision edges, I am using the setSize() method

test_platform.body.setSize(80, 80)

If I run the game, the collision edges appear at different coordinates than the object:

image

I read that I have to refresh the state of the object using the refreshBody() function, so I’m running

test_platform.refreshBody()

When doing this, the coordinates of the collision edges are placed at the correct coordinates, but the measurements are adapted to the size of the body, and not the ones I set with the setSize(80,80) function.

image

Full code:


var test_platform = platforms.create(setXFromCenter(0), setYFromCenter(0), 'ground');

test_platform.displayHeight = 100;

test_platform.displayWidth = 100;

test_platform.body.setSize(80, 80);

test_platform.refreshBody();

Would anyone know how to modify the size of the body and at the same time modify the size of the collision edges?

Thanks.

2

Remove refreshBody(). Use

test_platform.body.setOffset(X, Y).setSize(80, 80, false);

and choose whatever X Y you need.

3

The problem is almost solved.

Code:

var test_platform = platforms.create(400, 300, 'ground');
test_platform.displayHeight = 100;
test_platform.displayWidth = 100;
test_platform.setSize(80, 80).setOffset(0, 0)

But now, when I set X an Y coordinates as 0,0, the real collition box location is not the center of the body

image

Using the “true” parameter in the setOffseth method, like this:

test_platform.setSize(80, 80).setOffset(0, 0, true)

The problem is not solved.

Is there a way to place automatically the collition box at the center of its body?

4

Seems to work better this way:

const p = this.platforms.create(400, 300, 'ground');

p.body.setSize(80, 80, true);

p.setDisplaySize(100, 100);
1 Like
5

Thanks, it works…

image

Code:

       var test_platform = platforms.create(400, 300, 'ground');
        test_platform.setSize(100, 100)
        test_platform.setDisplaySize(120, 120)

Now, I have a new question

Is there a way to move the collition box from the coordenates that setSize(w,h) place it?

Something like this:

image
image721×721 19.5 KB

using setOffset(x,y) method the coordinates crashed

Code:

        test_platform.setSize(100, 100)
        test_platform.setDisplaySize(120, 120)
        test_platform.setOffset(0, 0)

Result:

image