JavaScript中的帆布游戏的边界

我必须用html5 canvas Javascript制作一款适合学校的游戏。我是新来的JavaScript和仍在学习，但我真的需要一些帮助，我有这个问题，并希望如果有人能帮我。我尝试了几件事情，但似乎没有任何工作，我很茫然。JavaScript中的帆布游戏的边界

所以这是玩家对象的代码。它可以从左到右移动。现在的问题是它离开画布。我希望它留在x轴上的画布上。

// Things to do when keys are down 
function onKeyDown(event) { 

    // prevent arrow keys from scrolling the page 
    if (event.keyCode >= 37 && event.keyCode <= 39) event.preventDefault(); 

    switch (event.keyCode) { 
     case 37: 
      player.vx = -1; 
      player.image = player.imgLeft; 
      break; // left key 
    // case 38: player.vy = -1; break; // up key 
     case 39: 
      player.vx = 1; 
      player.image = player.imgRight; 
      break; // right key 
    } 
} 

// Things to do when keys are up 
function onKeyUp(event) { 
    switch (event.keyCode) { 
     case 37: 
     case 39: 
      player.vx = 0; 
      player.image = player.original; 
      break; // left or right key released 
    // case 38: player.vy = 0; break; // up or down key released 
    } 
}

这是我走到这一步....

if ((player.x >= 800) && (player.x <= 0)) { 

} else { 

}

来源

2013-04-04 Jerrold van den Eeckhout

你可以考虑增加两个功能来检查你范围之内。（基本上是一样的代码，虽然与我的真实病情恢复，这将是你的else语句。）

// returns true if param is in range [0..799] 
function isInXrange(intPos) 
{ 
    if ((intPos>=0) && (intPos<800)) 
    return true; 
    else 
    return false; 
} 
// returns true if param is in range [0..599] 
function isInYrange(intPos) 
{ 
    if ((intPos>=0) && (intPos<600)) 
    return true; 
    else 
    return false; 
}

然后，您可以添加一个函数来移动播放器和其他处理与壁碰撞/流浪出界

function movePlayer() 
{ 
    if (isInXRange(player.x)) 
     player.x += player.vx; 
    if (isInXRange(player.y)) 
     player.y += player.vy; 
} 

function handleOutOfBounds() 
{ 
    if (isInXRange(player.x) == false) 
    { 
     // do something; 
    } 

    if (isInYRange(player.y) == false) 
    { 
     // do something else 
    } 
}

来源

2013-04-04 11:46:43 enhzflep

感谢您的回复！仍然没有工作，但我试图完成它！谢谢 – 2013-04-04 12:34:39

的基本上只是测试，看看x + width (optional: + velocity) > canvas.width和相同的高度。

来源

2015-10-06 23:24:50 DUUUDE123

@sideshowbarker为什么这不是答案？对我来说，这看起来非常像试图解决这个问题。你能否详细说明为什么它不会成为答案？ – Anders 2015-10-07 07:04:39

JavaScript中的帆布游戏的边界

回答

相关问题