Phaser3入门教程：第一个Phaser3游戏（中文版）（十）

• 跳跃的炸弹

 

在游戏中，我们还要增加一些捣蛋的家伙，使游戏有点挑战性，我们现在就加入这一环节。

思路是这样的：当我们第一次抓完所有的星星后，我们投放一个跳跃的炸弹。炸弹在关卡中跳来跳去，如果玩家碰到炸弹就算失败。拿到所有星星后，星星会重新落下让你再次收集，然后再多投放一个炸弹。玩家的任务就是：尽可能得到高分而不死掉。

第一件事是我们需要一组炸弹和一对碰撞器：

bombs = this.physics.add.group();   this.physics.add.collider(bombs, platforms);   this.physics.add.collider(player, bombs, hitBomb, null, this);

炸弹碰到平台自然会被弹回，如果碰到玩家就调用hitBomb函数，并停止游戏，玩家变成红色：

function hitBomb (player, bomb) {     this.physics.pause();       player.setTint(0xff0000);       player.anims.play('turn');       gameOver = true; }

为了投放炸弹，我们还要修改collectStar函数：

function collectStar (player, star) {     star.disableBody(true, true);       score += 10;     scoreText.setText('Score: ' + score);       if (stars.countActive(true) === 0)     {         stars.children.iterate(function (child) {               child.enableBody(true, child.x, 0, true, true);           });           var x = (player.x < 400) ? Phaser.Math.Between(400, 800) : Phaser.Math.Between(0, 400);           var bomb = bombs.create(x, 16, 'bomb');         bomb.setBounce(1);         bomb.setCollideWorldBounds(true);         bomb.setVelocity(Phaser.Math.Between(-200, 200), 20);         bomb.allowGravity = false;       } }

我们使用了组的方法countActive来查看还有多少星星是活动。如果没有，说明玩家已将拿到了所有的星星。然后我们调用iterate函数重新激活所有的星星，并把它们的y轴位置设为0 。于是它们会在次从屏幕顶部落下。下一部分代码就是制造炸弹了，我们首先会为炸弹产生一个随机的x坐标，但会避开玩家的位置，让人感觉这是偶然发生的。炸弹会在屏幕内弹跳、碰撞。它们不会受到重力的影响，而且速度是随机的。

最终，我们得到一个在屏幕中弹跳小炸弹。刚开始完时，这是很容易的，但随着炸弹数量的增加，你会发现躲避它们可是有极高难度的哟！

现在，我们已经完成了游戏的制作。

 

• 结束语

 

你已经学会了如何创建一个带有物理属性的精灵，如何控制它的动画效果，以及在游戏中如何与其他物体互动。你还可以增加更多的内容。比如增加场景的尺寸，让镜头滚动；增加不同类型的敌人；不同的得分项；给玩家来个生命条等等。

对于这些不太激烈的游戏类型，你可以设计让玩家挑战更快速的抓完星星。

在完成本教程后，可以看到官网还提供上百个范例，为你在将来的项目打下坚实的基础。如果你有任何问题，还可以在Phaser的论坛上寻求帮助。