How to set collision between Bullet class and Asteroids?

Phaser 3
1

Hello,

I would like to give a Bullet class collision detection so that when the player shoots something, like an asteroid, the bullets will hit and bounce off the asteroid. I’ve tried everything I can think of, but nothing seems to work. I am using impact physics, not arcade. Here is everything relating to the Bullet class:

 state = {
    game: {
      type: Phaser.AUTO,
      physics: {
        default: "impact",
        impact: {
          setBounds: {
            x: 0,
            y: 0,
            width: mapWidth,
            height: 700,
            thickness: 32
          }
        }
      },
      scene: {
        extend: {
          bullets: null,
          lastFired: 0,
          firingGun: false,
  
        },
        preload: function() {
          this.load.image("bullet", "assets/bullet6.png");
          this.textures.addBase64("bullet", bullet);

       this.load.image("flares", "assets/yellow.png");
          this.textures.addBase64("flares", flares);
        },

        create: function() {
            let Bullet = new Phaser.Class({
            Extends: Phaser.GameObjects.Image,

            initialize: function Bullet(scene) {
              Phaser.GameObjects.Image.call(this, scene, 0, 0, "bullet");

              this.speed = 0;
              this.born = 0;
            },

            fire: function(player) {
              if (player.flipX) {
                //  Facing left
                this.setPosition(player.x - 120, player.y + 10);
                this.speed = Phaser.Math.GetSpeed(-2000 + player.vel.x, 1);
              } else {
                //  Facing right
                this.setPosition(player.x + 120, player.y + 10);
                this.speed = Phaser.Math.GetSpeed(2000 + player.vel.x, 1);
              }

              this.born = 0;
            },

            update: function(time, delta) {
              this.x += this.speed * delta;

              this.born += delta;

              if (this.born > 2000) {
                this.setActive(false);
                this.setVisible(false);
              }
            }
          });

         this.bullets = this.add.group({
            classType: Bullet,
            runChildUpdate: true
          });

        const createBulletEmitter = () => {
            this.flares = this.add
              .particles("flares")
              .setDepth(3)
              .createEmitter({
                x: 200,
                y: 350,
                angle: { min: 170, max: 190 },
                scale: { start: 0.4, end: 0.2 },
                blendMode: "ADD",
                lifespan: 20,
                on: false
              });
          };
          createBulletEmitter();
        },

        update: function(time, delta) {
          if (this.cursors.space.isDown && time > this.lastFired) {
            let bullet = this.bullets.get();
            bullet.setActive(true);
            bullet.setVisible(true);
            bullet.setDepth(3).setScale(0.75);

            if (bullet) {
              bullet.fire(this.player);

              this.lastFired = time + 100;
            }

            if (this.firingGun === false) {
              this.gunSound.play();
              this.firingGun = true;
            }
          }
          if (!this.cursors.space.isDown) {
            this.gunSound.stop();
            this.firingGun = false;
          }

          //  Emitters to bullets
          this.bullets.children.each(function(b) {
            if (b.active) {
              this.flares.setPosition(b.x, b.y);
              this.flares.setSpeed(b.speed + 500 * -1);
              this.flares.emitParticle(1);
            }
          }, this);
        }

Sorry I know it’s a lot. But I have no idea how to go about this. Any help would be appreciated.

2

If you want collisions your bullet class should extend Phaser.Physics.Impact.Sprite not Phaser.GameObjects.Image

In your bullet group config you have put classType: Bullet. This should be classType: Phaser.Physics.Impact.Sprite

Then when you want to add to a group use groupName.add(new yourClass());

To create a collision between two sprites/sprite groups use something like this from within your scene:
this.physics.add.collider(bullets, ship); // You can also add a callback function that will execute on collision

2 Likes
3

You can use { classType: Bullet } once you’ve changed Bullet to extend Phaser.Physics.Impact.Sprite.

1 Like