Avoid overlapping Sprites controlled with a keyboard

Phaser 3
1

I have a group. I can move members of it nicely with keyboard keys.
I do not want them to overlap one another. ever.

I have this code:

export class GameScene extends Phaser.Scene {
  public preload() {
    this.load.image("dude", `${process.env.PUBLIC_URL}/dude.png`);
  }

  public create() {
    // setup our group of controllables
    this.dudes = this.physics.add.group({
      key: "dude",
      quantity: 4,
      immovable: true,
      collideWorldBounds: true,
      bounceX: 0,
      bounceY: 0,
      setXY: { x: 20, y: 120, stepX: 30, stepY: 0 },
    });
    this.dudes.setOrigin(0, 0);

    // add collisions
    this.physics.add.collider(this.dudes, this.dudes, (a, b) => {
      a.body.stop();
      b.body.stop();
    });

    // add controller keys (arrows)
    this.cursorKeys = this.input.keyboard.createCursorKeys();
  }
  // Phaser.Types.Actions.CallCallback
  private setGroupProp(f: (a: Sprite) => void) {
    if (this.dudes) Phaser.Actions.Call(this.dudes?.getChildren(), f, null);
  }
  public update() {
    if (this.cursorKeys?.up?.isDown) {
      this.setGroupProp((dude) => dude.body.setVelocityY(-40));
    } else if (this.cursorKeys?.down?.isDown) {
      this.setGroupProp((dude) => dude.body.setVelocityY(40));
    } else {
      this.setGroupProp((dude) => dude.body.setVelocityY(0));
    }

    if (this.cursorKeys?.right?.isDown) {
      this.setGroupProp((dude) => dude.body.setVelocityY(40));
    } else if (this.cursorKeys?.left?.isDown) {
      this.setGroupProp((dude) => dude.body.setVelocityX(-40));
    } else {
      this.setGroupProp((dude) => dude.body.setVelocityX(0));
    }
  }
}

this stops my sprites when they collide but… I have no idea what to do to start them again or when to do that.

I hope you can help me out!
=D

2

You can try something like

dude.body.setVelocityY(dude.body.touching.down ? 0 : 40);
1 Like