在方块地图中移动玩家

Moving a player in tilemaps

本文关键字:移动 玩家 地图 方块      更新时间:2023-09-26

我使用香草瓷砖,我不确定是否有软件在那里相关的瓷砖,但如果有保证我只是使用普通的javascript,我有一个问题,虽然,我想移动一个球员的x时按下按钮,但它不移动,球员是绿色的,并由数字4在瓷砖上识别。

它记录了我按下按钮(在控制台),但根本没有移动玩家,有人能指出这个问题吗?看看第62-89行,除了一些全局变量之外,错误主要发生在这里。

这里有一个到jsfiddle的链接,我使用这个是因为我需要显示这些块不会移动。http://jsfiddle.net/8jr2ha3h/

var playerY = 0;
var playerX = 0;
var moveLeft = 65;
var moveRight = -65;
//THE PLAYER
player.onload = function(){
    for(var i = 0; i < mapArray.length; i++){
        for(var j = 0; j < mapArray[i].length; j++){
            if(mapArray[i][j]==4){
                context.drawImage(player, playerX, playerY, 45,37);
            }
            playerX+=45;
        }
        playerX = 0;
        playerY +=37;
    }
};
//KEY FUNCTIONS
document.onkeydown = function(e) {
//identifying that it's a window event.
    e = e || window.event;
    switch(e.which || e.keyCode) {
        //37 is key for left arrow.
        case 37:
        {
            playerX = playerX - moveLeft;
            console.log(playerX);
            console.log('left');
        }
        break;
    }
}    

似乎你只画了player.onload()中的玩家。你可能想要将所有渲染代码放在单个render()函数中,并可能在player.onload()中调用该函数,然后在屏幕变化时也调用该函数(玩家移动,敌人移动/死亡,地图因任何原因而变化……有很多原因你需要重新绘制)。

你可能想在这里考虑一个主要的游戏循环,它将(非常简单地)达到以下效果:

while (true) { checkForInputFromThePlayer(); // this can update player coordinates, etc doSomeAI(); // Move some enemies around, have them attack the player render(); }

编辑:游戏循环的一个很好的例子可以在《yckart》对requestAnimationFrame有限帧率的回答中看到