Phaser.js 为什么重叠不起作用？

Question

我在 phaser.js

上创建了一个小场景

敌人一枪打我，我就得死，可是不行

还有，当我射击敌人时，他们应该死。我在代码中写了一个重叠函数，但它不起作用。

下面是情况截图：

为什么会这样，你能帮帮我吗？

var playState = {

create: function()
{
    this.enemiesArray = [];

    game.physics.startSystem(Phaser.Physics.ARCADE);

    this.spacebar;
    this.spacebar = game.input.keyboard.addKey(Phaser.Keyboard.SPACEBAR);
    this.escapeKey = game.input.keyboard.addKey(Phaser.Keyboard.ESC);

    this.ship = game.add.sprite(game.width / 2, game.height / 2 + 300, 'ship');
    this.ship.anchor.setTo(0.5, 0.5);
    this.ship.scale.setTo(0.4, 0.4);
    this.cursor = game.input.keyboard.createCursorKeys();

    this.enemy = game.add.sprite(game.width / 2, game.height / 2 - 300, 'alien');
    this.enemy.anchor.setTo(.5,.5);
    this.enemy.scale.setTo(0.4,0.4);
    game.time.events.loop(1000, this.spawnEnemy, this);
    game.time.events.loop(750, this.spawnEnemyBullet, this);

    game.physics.arcade.enable(this.ship, this.enemy, this.bullet, this.enemyBullet);

},

update: function()
{

    if(this.cursor.left.isDown)
    {
        this.ship.x -= 7;
    }

    for(var a = 0; a < this.enemiesArray.length; a++)
    {
        this.enemiesArray[a].x -= 2;
    }

    if(this.escapeKey.isDown)
    {
        game.state.start('menu');
    }

    if(this.cursor.right.isDown)
    {
        this.ship.x += 7;
    }

    if(this.spacebar.isDown)
    {
        this.bullet = game.add.sprite(this.ship.x, this.ship.y, 'bullet');
        this.bullet.anchor.setTo(0.5,0.5);
        this.bullet.scale.setTo(0.2,0.2);
        game.physics.arcade.enable(this.bullet);
        this.bullet.body.velocity.y = -600;

        if(!this.bullet.inWorld)
        {
            this.bullet.kill();
        }
    }
    game.physics.arcade.overlap(this.enemyBullet,this.ship,this.gameOverOpenMenuScreen,null,this);
    game.physics.arcade.overlap(this.bullet,this.enemy,this.killenemy,null,this);
},

killenemy: function()
{
    this.enemy.kill();
},

gameOverOpenMenuScreen: function()
{
    game.state.start('menu');
},

spawnEnemy: function()
{
    this.enemy = game.add.sprite(Math.random()*game.width, game.height / 2 - 300, 'alien');
    this.enemy.anchor.setTo(.5,.5);
    this.enemy.scale.setTo(0.4,0.4);

    this.enemiesArray.push(this.enemy);
},

spawnEnemyBullet: function()
{
    for(var i = 0; i < this.enemiesArray.length; i++)
    {
        this.enemyBullet = game.add.sprite(this.enemiesArray[i].x, this.enemiesArray[i].y, 'bullet');
        this.enemyBullet.anchor.setTo(0.5,0.5);
        this.enemyBullet.scale.setTo(0.2,0.2);
        this.enemyBullet.angle = 180;
        game.physics.arcade.enable(this.enemyBullet);
        this.enemyBullet.body.velocity.y = 600;
    }
}

}

Answer 1

您可以使用组创建项目符号，但我认为您应该先更正此问题：

game.physics.arcade.enable([this.ship, this.enemy]);

将此添加到您的代码中：

create : function() {
   ...
   //After creating the sprites
   this.bulletPlayerTime = 0;

   this.bulletsPlayer = game.add.group();
   this.bulletsPlayer.enableBody = true;
   this.bulletsPlayer.physicsBodyType = Phaser.Physics.ARCADE;

   for (var i = 0; i < 20; i++)
   {
       var b = this.bulletsPlayer.create(0, 0, 'bullet');
       b.name = 'bullet' + i;
       b.exists = false;
       b.visible = false;
       b.checkWorldBounds = true;
       b.events.onOutOfBounds.add(function(bullet) { bullet.kill(); }, this);
   }
   ...
}

update : function() {

  ...
  if (this.spacebar.isDown) {
     this.firePlayer();
  }
  ...
}

firePlayer : function() {

   if (game.time.now > this.bulletPlayerTime) {
      bullet = bulletsPlayer.getFirstExists(false);

      if (bullet) {
        bullet.reset(this.ship.x + 6, this.ship.y - 8);
        bullet.body.velocity.y = -300;
        this.bulletPlayerTime = game.time.now + 300;
      }
   }

}

现在您必须执行相同的功能，但这次是针对敌人...

你可以看到更多here

Answer 2

您应该首先将所有项目符号归为一组：

const bulletsGroup = this.add.group();

(注意本裁判到场)

然后将你们每个项目符号添加到组中：

bulletsGroup.add(<your game object>);

完成这 2 个步骤后，您就可以设置重叠功能了。该函数为其前 2 个参数获取 group/object，并在发生重叠时调用回调：

game.physics.arcade.overlap(this.ship, bulletGroup, () => console.log('boom!'));

Phaser.js 为什么重叠不起作用？

Phaser.js why overlap doesn't work?

javascript

phaser-framework