-1

当检测到与形成障碍物的 div 的上部发生碰撞时，我遇到了问题。

我可以检测到与侧面和下边缘的碰撞，但不能检测到与上边缘的碰撞。

for (i = 0; i < game.obstacles.length; i++){
  // Colisiones con los bordes laterales
  if (marioX < obstacleX[i] + obstacleWidth[i] &&
    marioX + marioWidth > obstacleX[i] &&
    marioY < obstacleY[i] + obstacleHeight[i] &&
    marioY + marioHeight > obstacleY[i]) {
    game.player.collisionLateral();
  }
  // Colisiones con el borde inferior
  if (marioY < obstacleY[i] + obstacleHeight[i] &&
    marioY + marioHeight > obstacleY[i] &&
    marioX < obstacleX[i] + obstacleWidth[i] &&
    marioX + marioWidth > obstacleX[i]) {
    game.player.collisionDown();
  }
  // Colisiones con el borde superior
  if (marioY > obstacleY[i] + obstacleHeight[i] &&
    marioY + marioHeight < obstacleY[i] &&
    marioX < obstacleX[i] + obstacleWidth[i] &&
    marioX + marioWidth > obstacleX[i]) {
    //entonces
    game.player.collisionUp();
  }
}

我有这两次碰撞，但我无法让角色留在那个 div 上

我在这里留下了 github 的链接https://github.com/JesusSilva/super-mario

4

2 回答 2

0

好的，首先你的检测代码不起作用，如果你对不同的情况发出一些警报，你会看到最后一个“if”永远不会被调用，它总是第二个。使用此代码，我得到了正确的行为：

for (i = 0; i < game.obstacles.length; i++){

  if (marioX < obstacleX[i] + obstacleWidth[i] &&
    marioX + marioWidth > obstacleX[i] &&
    marioY < obstacleY[i] + obstacleHeight[i] &&
    marioY + marioHeight > obstacleY[i]) {
    game.player.collisionLateral();
  }
  //Test when mario is below the obstacle
  else if (marioY < obstacleY[i] + obstacleHeight[i] &&
    marioY + marioHeight >= obstacleY[i] &&
    marioX < obstacleX[i] + obstacleWidth[i] &&
    marioX + marioWidth > obstacleX[i]) {
    game.player.collisionDown();
  }
  //Test when mario is above the obstacle
  else if (marioY + marioHeight > obstacleY[i] + obstacleHeight[i] &&
    marioY <= obstacleY[i] + obstacleHeight[i] &&
    marioX < obstacleX[i] + obstacleWidth[i] &&
    marioX + marioWidth > obstacleX[i]) {
    game.player.collisionUp();
  }
 }
}

但这并不能解决您的问题。当马里奥从上面撞到障碍物时，他需要留在这个障碍物上，所以你调用你的函数“collisionUp”，它把 speedY 归零。但是你的 main.js 中有这个函数：

  setInterval(function() {
    game.player.render();
    game.player.winner();
    checkCollisions();
  }, 1000 / fps);

这个函数对 Mario 的 Y 位置执行此操作：

  var newY = this.posY + this.speedY - 5;
  if (newY >= 0 && newY <= this.size.height - 70) {
    this.posY = newY;
  }
  this.element.css({ bottom: this.posY, left: this.posX });

这总是将马里奥向下移动以模拟重力。所以你必须找到一个解决方案，当由于马里奥撞到上面的障碍物，speedY为零时，这部分渲染功能被停用。

;)

于 2018-02-25T21:17:50.633 回答
0

您的垂直碰撞检测条件是互斥的。

marioY > obstacleY[i] + obstacleHeight[i] &&
marioY + marioHeight < obstacleY[i]

marioHeight并且obstacleHeight[i]是积极的，对吧？让我们用 0 替换它们来删除这里的常量。然后我们得到 marioY > barrierY[i] && marioY < barrierY[i]，它们永远不会同时为真。

您所有的碰撞测试代码实际上都是在检查 div 是否重叠，您只需要做一次。

要确定发生碰撞的边缘，您可能需要检查从 mario 中心到障碍物的 x 和 y 距离，并使用最短的距离来确定碰撞发生的位置，或者您可能想要顶部范围内的任何东西或mario 的底部以记录垂直碰撞，即使它靠近右边缘或左边缘。您可能有在碰撞时马里奥和障碍物移动的矢量，您可以利用它们的差异来确定碰撞的矢量。

于 2018-02-25T21:16:54.660 回答