我使用jQuery / HTML5 Canvas和tile map算法创建了一个小动作原型。我的问题是碰撞是奇怪的。我将解释,如果我左右移动,则检测到碰撞并且移动停止,如果我上下移动,则会发生同样的情况。如果我向左和向右移动(发生碰撞)那么当我在左右碰撞后上下移动时,上下碰撞不再成立。
这是我的JSFiddle
以下是我检测和移动的片段
if (keydown == UP) {
if (!hasCollided(pX, pY - v, mX, mY)) pY -= v;
keydown = null;
} else if (keydown == DOWN) {
if (!hasCollided(pX, pY + v, mX, mY)) pY += v;
keydown = null;
} else if (keydown == LEFT) {
if (!hasCollided(pX - v, pY, mX, mY)) pX -= v;
keydown = null;
} else if (keydown == RIGHT) {
if (!hasCollided(pX + v, pY, mX, mY)) pX += v;
keydown = null;
}
对我的逻辑的任何帮助将不胜感激。提前谢谢。
答案 0 :(得分:2)
Here你去!它并没有太大的不同。大多数情况下,你检查过你每次检查一个瓷砖是否有碰撞时都移动了玩家,所以如果至少有一个被检查过的瓷砖没有碰撞,那么无论如何都会移动玩家。
这样做:
var desPosX = 0;
var desPosY = 0;
if (keydown == UP) {
desPosY = -v;
} else if (keydown == DOWN) {
desPosY = v;
}
if (keydown == LEFT) {
desPosX = -v;
} else if (keydown == RIGHT) {
desPosX = v;
}
var collided = false;
if(!gliding)
keydown = null;
for (var y = minY; y < maxY; y++) {
for (var x = minX; x < maxX; x++) {
if (map[y][x] == 1) {
mX = x * 32;
mY = y * 32;
}
if (hasCollided(desPosX+pX, desPosY+pY, mX, mY)) {
collided = true;
}
}
}
if (!collided) {
pX += desPosX;
pY += desPosY;
}
玩得开心!