Javascript游戏:按键时移动角色

Question

我正在为学校制作一个简单的基于画布的Javascript/HTML游戏.我有一个角色,在2D级别上向左或向右移动.最初,我刚刚添加了一个事件监听器,并在一个开关中确定按下了哪个键,我会将字符的位置增加一定的像素数.这导致运动非常不稳定并且难以使用.

我想要发生的是在按下按键时平稳移动,在释放时立即停止.

我在想如果有某种"按键关闭"功能,那么我可以使用它.

如果这是最好的方法,我怎么能这样做,如果有更好的方法,我很想知道它.

注意:我宁愿不必使用外部库.我对jQuery很好,但我不想学习一种全新的游戏方式.

Answer 1

您可能需要考虑在按住按钮时增加变量的加速度,随着力的增加,玩家将加速直到达到最大速度,这就是达到平滑感的方式.

当你放开左/右时,我已经添加了突然停止,但我不建议这样做,而是将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;
    }