键控产生意外结果.HTML5游戏

Keydown producing unexpected result. HTML5 Game

本文关键字：结果 HTML5 游戏 意外      更新时间：2024-02-27

因此，我正处于在html5中创建我的第一款平台风格游戏的最初阶段。到目前为止，我只实现了左右移动，没有"重力"或碰撞检测。

然而，我已经遇到了一个问题。

如果你在短时间内向左或向右移动，"角色"会按预期行事（我使用角色的方式很松散，因为它是实际移动的地图）。但是，如果您按住该键，则地图移动过快。

我认为问题是keydown事件监听器一直在监听，因为移动地图是在游戏的每一个节拍或帧之前移动的。

所以我的问题是，我如何才能让关键点向下只在游戏的每一次滴答声（20毫秒）增加地图偏移量。

这是我的JSFiddle：点击这里

document.addEventListener('keydown',function(event){
    var dir = event.which;
    if(dir == directions.LEFT){
        mapOffsetX += mapOffsetDistanceX;
        event.preventDefault();
    };
    if(dir == directions.RIGHT){
        mapOffsetX -= mapOffsetDistanceX;
        event.preventDefault();
    };
});
document.addEventListener('keyup',function(event){
    var dir = event.which;
    if(dir == directions.LEFT){
        mapOffsetX -= mapOffsetDistanceX;
    };
    if(dir == directions.RIGHT){
        mapOffsetX += mapOffsetDistanceX;
    };
});
initFloorObject(100,c.height/2,300,20,0,0,0,1);
var myInt = setInterval(function(){
clearScreen();
for(var i=0;i<floorObject.length;i++){
    floorObject[i][0] = parseInt(floorObject[i][0])+mapOffsetX;
};
drawChar();
drawFloorObjects();
},20);

每次keydown时将变量设置为false，并每20毫秒将其设置回true。

var isKeydownAvailable = true;
document.addEventListener('keydown', function (event) {
    var dir = event.which;
    if(isKeydownAvailable){
        if (dir == directions.LEFT) {
            mapOffsetX += mapOffsetDistanceX;
            event.preventDefault();
        };
        if (dir == directions.RIGHT) {
            mapOffsetX -= mapOffsetDistanceX;
            event.preventDefault();
        };
        isKeydownAvailable = false;
    };
});

在间隔中，将isKeydownAvailable重置为true。

var myInt = setInterval(function () {
    clearScreen();
    for (var i = 0; i < floorObject.length; i++) {
        floorObject[i][0] = parseInt(floorObject[i][0]) + mapOffsetX;
    };
    drawChar();
    drawFloorObjects();
    isKeydownAvailable = true;
}, 20);

对操作使用布尔值，并在间隔内检查它们
在按下键时，将布尔值isMovingLeft设置为true，然后在区间函数中仅添加if(isMovingLeft)的偏移量。在其他动作中做到这一点，你就可以继续了。

相关文章：