PhaserJS 碰撞 tilemap 不工作

PhaserJS collision tilemap not working

我有一张图块地图,其中只有 1 层正确地与玩家发生碰撞。通过所有示例,但我似乎无法让它在多层上工作。

我有 1 个 tilemap,其中包含总共 13 个层的所有 json 数据,但对于示例,我只包含 3 个。

我希望玩家与不同的层发生碰撞并有不同的回调,例如不能穿过,如果在范围内则不能捡起物品等,但都使用 1 spritemap/tilemap。

var game = new Phaser.Game(1200, 780, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render });

function preload() {
        this.load.tilemap('main_map', 'img here', null, Phaser.Tilemap.TILED_JSON);
        this.load.image('sprite_map', 'img here');
        this.load.image('player_image', 'img here');
}

var map;
var tileset;
var bLayer;
var wLayer;
var player;
var sLayer;
var cursors;

function create() {

    game.physics.startSystem(Phaser.Physics.ARCADE);

    // initiallize the tilemap
    map = game.add.tilemap('main_map');
    map.addTilesetImage('otherNew', 'sprite_map');

    //draw the layers 
    bLayer = map.createLayer(0);
    wLayer = map.createLayer(1);
    sLayer = map.createLayer(2);
    wLayer.resizeWorld();

    player = game.add.sprite(600, 600, 'player_image');
    game.physics.arcade.enable(player);
    player.body.collideWorldBounds = true;  // works

    //game camera and movment keys here 

}
function update() {
    game.physics.arcade.collide(player, wLayer); // DOES NOT WORK
    game.physics.arcade.collide(player, sLayer); // THIS WORKS
    map.setCollision(1, true, wLayer); // DOES NOT WORK
    map.setCollision(2, true, sLayer); // THIS WORKS 

   //movement here already works so didn't include

}

我认为您的 wLayer.resizeWorld(); 函数使您的瓦片地图的 width/height 成为世界的大小。看起来这是 wLayer 和 sLayer 之间的唯一区别。

在 Phaser 中设置 width/height 不会自动调整碰撞大小 body。为此,请使用 setSize 函数。

要查看当前 body,请使用 Phaser 的 debug 方法

this.game.debug.body(someSprite, 'rgba(255,0,0,0.5)');

答案是每一层都有自己的一组图块地图,并且由于我使用 spritesheet 生成每一层,这些层有一些需要设置的值。我没有耐心去检查我需要什么实际的碰撞层,但是因为我已经将它们全部拆分成单独的逻辑层,所以我只是将每个层设置在 0 到 100 之间。

// In the create section    
map.setCollisionBetween(0, 100,true, wLayer,true);
map.setCollisionBetween(0, 100,true, sLayer,true);