我正在为学校制作一个简单的基于 Canvas 的 Javascript/HTML 游戏。我有一个 Angular 色,在二维水平上向左或向右移动。最初,我只是添加了一个事件监听器,并在一个开关中确定按下了哪个键,我会将 Angular 色的位置增加一定数量的像素。这导致运动非常不稳定且难以处理。
我想要的是按下键时平滑移动,松开时立即停止。
我在想,如果有某种“while key down”功能,那么我就可以使用它。
如果这是最好的方法,我该怎么做,如果有更好的方法,我很想知道。
注意:我宁愿不必使用外部库。我对 jQuery 没问题,但我不想学习一种全新的游戏方式。
最佳答案
您可能需要考虑在按住按钮时增加的变量中增加加速度,随着力的增加,玩家的速度也会增加,直到达到最大速度,这就是实现流畅感觉的方式。
当你向左/向右放开时,我添加了突然停止,但我不建议这样做,而是将 xforce 减小到 0,以获得平滑的感觉,同时也减慢速度。
pixelx 是你应该在每个循环中移动玩家的距离(游戏刻度)
window.addEventListener('keydown', handleKeyDown, true)
window.addEventListener('keyup', handleKeyUp, true)
var maxspeed = 6;
var xforce = 0;
var pixelx = 0;
var direction = 1;
var key_left = false;
var key_right = false;
在游戏循环中...
if (key_left)
{
xforce--;
direction = -1;
}
if (key_right)
{
xforce++;
direction = 1;
}
if (xforce > maxspeed)
xforce = maxspeed;
if (xforce < -maxspeed)
xforce = -maxspeed;
if (!key_left && !key_right)
{
pixelx = 0;
xforce = 0;
}
else
{
pixelx += xforce;
}
playerlocationx = playerlocationx + pixelx;
playerdirection = direction;
函数...
function handleKeyDown(event)
{
if (event.keyCode == 37)
key_left = true;
else if (event.keyCode == 39)
key_right = true;
}
function handleKeyUp(event)
{
if (event.keyCode == 37)
key_left = false;
else if (event.keyCode == 39)
key_right = false;
}
关于Javascript 游戏 : Move character while key down,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22262130/