Why is my rectangle not colliding with the other rectangle?

Phaser 3
1

Hi guys,

new phaser user here.
Currently getting used to the phaser world and I have this very simple example:

create = () => {
    const rect1 = this.add.rectangle(
      (this.game.config.width as number) / 2,
      (this.game.config.height as number) / 2,
      100,
      100,
      0xffffff
    );
    this.physics.add.existing(rect1, true);

    const rect2 = this.add.rectangle(
      (this.game.config.width as number) / 2,
      50,
      100,
      100,
      0xfddfff
    );
    this.physics.add.existing(rect2);

    const body1 = rect1.body as Physics.Arcade.StaticBody;

    body1.onCollide = true;

    const body2 = rect2.body as Physics.Arcade.Body;

    body2.setBounce(0.2, 0.2);
    body2.setCollideWorldBounds(true);
  };

I would expect that the first rectangle which is falling down (body) collides with the second rectangle thats about in the middle of the stage (static body) - but it isn’t. The rectangly just “falls” through it.

I cannot figure out why that is? What do I have to set where, so the first rect, sits on top of the other rect after it fell down, basically “landing” on it?

Thx Geralt

2 
this.physics.add.collider(rect1, rect2);

Unrelated: you can substitute this.scale.width for (this.game.config.width as number).

3

Thank you very much I’m dumb.

This doesn’t work, I also added a scale property to my game config, but still doesn’t work.

Thx Geralt