1

只是想在我的游戏中实现碰撞。

我对如何测试瓷砖的碰撞有疑问,因此碰撞不起作用。

我有一个看起来像这样的数组:

var coll_array = [
[[tile_index],[x],[y]] 
]

瓦片索引是im使用的图像地图中瓦片的编号,x是x位置,y是瓦片的y位置。

基本上,如果 tile_index 不为 0,那么玩家应该会撞到这个 tile,这就是我想要实现的。

请参阅更新以获取代码示例

出于某种原因,虽然我不确定为什么,变量 collided 一直返回 false,但我相信这与我设置数组的方式有关。

任何帮助将非常感激。我这里有游戏的现场版

用户名=客人

密码=客人。

请使用新游戏,以便您可以看到正确的 console.log

我已经在播放器函数中放置了数组的控制台日志,以便您可以看到它是如何设置的。

谢谢

更新

好的,经过更多的尝试,代码现在看起来像这样:

function Player()
{
  var sprite = new Sprite(),
   collision_array,
   collided,
   x,
   y,
   w = sprite.width,
   h = sprite.height,
   gameW = canvas.width,
   gameH = canvas.height-192,
block_x,
    block_y,
    block_cx,
    block_cy,
    combined_hw = 32,
    combined_hh = 32,
   player_cx,
   player_cy;

this.keys = [];
// What delay do we want to use between switching sprites (in milliseconds)
this.moveSpeed = 4;
this.player = null;

this.init = function(coll_data){
    collision_array = coll_data;
    console.log(collision_array);
};

this.init_Player = function(pos_X, pos_Y){
  this.player = sprite.load("player");
   x = pos_X;
   y = pos_Y;
};

this.update = function(elapsed) {
    // perform a switch statement on the last key pushed into the array
    // this allows us to always move the direction of the most recently pressed
    // key

    switch (this.keys[this.keys.length - 1])
    {
        case 37:
            // move the player left on the screen
            x -= this.moveSpeed * elapsed;
            break;
        case 38:
            // move the player up on the screen
            y -= this.moveSpeed * elapsed;
            break;
        case 39:
            // move the player right on the screen
            x += this.moveSpeed * elapsed;
            break;
        case 40:
            // move the player down on the screen
            y += this.moveSpeed * elapsed;
            break;
    }
    if (x < 0)
    {
        x = 0;
    }
    if (x >= gameW - w)
    {
        x = gameW - w;
    }
    if (y < 0)
    {
        y = 0;
    }
    if (y >= gameH - h)
    {
        y = gameH - h;
    }

    player_cx = x+(32/2);
    player_cy = y+(32/2);

    collision_array.forEach(function(row) {
        for(var i = 0; i<row.length;i++){
            if(row[i][0] != 0){
                block_x = row[i][1];
                block_y = row[i][2];
                block_cx = block_x+(32/2);
                block_cy = block_y+(32/2);

            }

        }
        collided = Math.abs(player_cx - block_cx)< combined_hw
            && Math.abs(player_cy - block_cy)< combined_hh;
    });

    if(collided)
    {
        console.log("COLLIDED!")
    }
    return {
        'pos_X':x,
        'pos_Y':y
    };
};

this.draw = function() {
    ctx.drawImage(this.player,x, y, w ,h);
};
}

这有效,但它只适用于存储在数组中的最后一个位置,例如右下角,你能看到我哪里出错了吗?

4

2 回答 2

0

我只是快速阅读了这篇文章,但你说它只适用于最后一个区块,也许你应该尝试一下。

 collided |= Math.abs(player_cx - block_cx)< combined_hw
            && Math.abs(player_cy - block_cy)< combined_hh;

ORing 发生碰撞,因此如果有任何块发生碰撞,这将是真的。

于 2013-04-14T22:21:18.883 回答
0

好的,所以我设法与固体块和对话出现的区域发生碰撞!

如果您想看看如何完成,我已将代码上传到此处的实时站点。

为了澄清这一切都是通过一个平铺地图编辑器 JSON 文件完成的。而且我想这对任何人都有用,所以当我有机会时,我会把它放在 git 上,我什至会在博客上写一篇教程,因为我发现很难找到这方面的资源。

感谢任何帮助过的人。

于 2013-04-15T11:59:30.363 回答