Question

我是游戏开发的初学者，并且一直在努力在一系列瓷砖和玩家矩形之间完成碰撞。这个游戏具有跳跃和重力。首先碰撞工作，但非常笨重。有时候当玩家最终在一个瓷砖的顶部和一个小的边缘时，它会立即传送到右侧或左侧（取决于什么边缘/角落）和它的下降。当与瓷砖底部碰撞时也会发生这种情况;玩家将立即传送到侧面并进一步向上移动。根据我的理解，瓦片碰撞检测器将碰撞与一侧或另一侧混淆，因为当玩家碰到瓦片的边缘时，检测器将其读取为好像它与两者碰撞并决定将玩家置于其他基础上的最高坐标速度（又名speedX和speedY）。我通过设置speedY = 0每次碰到瓷砖的顶部来解决这个问题，这解决了问题，但另一个问题就出来了。现在，如果玩家位于一个平铺的顶部，然后摔倒并且很快就会向前移动，它不会与平铺的一侧碰撞，但它会很快再次回到它的顶部。

我只需要一些关于如何解决这个问题的提示，因为我尝试的所有内容都会导致另一个问题。我听说这是开发基于2D磁贴的游戏中常见的错误。

这是我的碰撞检测代码（瓷砖地图的数组是2D）：

function TileCollisionManager() {
let tileSize = 32;
let baseCol = Math.floor(player.x/tileSize);
let baseRow = Math.floor(player.y/tileSize);
let colOverlap = player.x%tileSize;
let rowOverlap = player.y%tileSize;



//horizontal collision detection

if (player.speedX > 0) {
    if ((fglayer[baseRow][baseCol+1] && !fglayer[baseRow][baseCol]) ||
        (fglayer[baseRow+1][baseCol+1] && !fglayer[baseRow+1][baseCol] && rowOverlap)) {
        player.x = baseCol*tileSize;
    }
}

if (player.speedX < 0){
    if((!fglayer[baseRow][baseCol+1] && fglayer[baseRow][baseCol]) ||
        (!fglayer[baseRow+1][baseCol+1] && fglayer[baseRow+1][baseCol] && rowOverlap)){
        player.x = (baseCol+1)*tileSize;


    }
}

//vertical collision detection

//Collision with the top of a tile
if(player.speedY>0){
    if ((fglayer[baseRow+1][baseCol] && !fglayer[baseRow][baseCol]) ||
        (fglayer[baseRow+1][baseCol+1] && !fglayer[baseRow][baseCol+1] && colOverlap)) {
        player.y = ((baseRow)*tileSize);
        player.jumping = false;
        player.speedY = 0;
        player.gravity = 0;
        onGround = true;
    } else {
        onGround = false;
    }
}

 //Collision with the bottom of a tile
if (player.speedY<0) {
    if ((!fglayer[baseRow+1][baseCol] && fglayer[baseRow][baseCol]) ||
        (!fglayer[baseRow+1][baseCol+1] && fglayer[baseRow][baseCol+1] && colOverlap)){
        player.y = (baseRow+1)*tileSize;
    }
}

如果我太不清楚请说出来。提前致谢！编辑：变量fglayer是对tilemap数组的引用。

HTML5 JS Canvas游戏中的平铺碰撞错误

0 个答案: