Collision only works with base layer in tilemaps

[Wingzgaming]

Hi There,

I am having this issue with phaser(2.9.4) where collision with a tilemap only work with the base layer. In my example I have the collide-able world and then I wanted to add a background underneath that was part of the tilemap.

Here is my code(excluding boot and preload)

 

Game.preload = function () {
    game.stage.backgroundColor = "000000";
};

Game.create = function () {
    Game.scale = 5;

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

    game.physics.arcade.gravity.y = 850;

    Game.cursors = game.input.keyboard.createCursorKeys();

    Game.map = game.add.tilemap('map');
    Game.map.addTilesetImage('tiles_1', 'tiles');

    Game.back = Game.map.createLayer('Background');
    Game.back.setScale(Game.scale);
    Game.back.renderSettings.enableScrollDelta = false;

    Game.spawn = Game.map.createLayer('Spawn');
    Game.spawn.setScale(Game.scale);
    Game.spawn.renderSettings.enableScrollDelta = false;

    Game.decor = Game.map.createLayer('Decor');
    Game.decor.setScale(Game.scale);
    Game.decor.renderSettings.enableScrollDelta = false;

    Game.layer = Game.map.createLayer('Collideable');
    Game.layer.setScale(Game.scale);
    Game.layer.renderSettings.enableScrollDelta = false;
    Game.layer.resizeWorld();

    Game.map.setCollisionByExclusion([]);

    Game.player = game.add.sprite(game.world.centerX, game.world.centerY, 'player');
    Game.player.scale.setTo(Game.scale);
    //Game.player.anchor.setTo(0.5);

    game.physics.enable(Game.player, Phaser.Physics.ARCADE);

    Game.player.body.collideWorldBounds = true;

    game.camera.follow(Game.player);

    var enemyPos = Game.findTiles(952, true);
    Game.enemies = game.add.group();
    for (var enemies in enemyPos) {
        var enemy = game.add.sprite(enemyPos[enemies][0] * Game.scale * 16, enemyPos[enemies][1] * Game.scale * 16, 'enemy');

        Game.enemies.add(enemy);

        enemy.scale.setTo(randomInt(1, 5));
        game.physics.enable(enemy, Phaser.Physics.ARCADE);
        enemy.body.collideWorldBounds = true;
        enemy.speed = randomInt(150, 250);
        enemy.interval = 0;
        enemy.update = function () {
            this.interval++;
            if (this.interval >= 20) {
                this.interval = 0;
                if (this.x > Game.player.x) {
                    this.body.velocity.x = -this.speed;
                } else if (this.x < Game.player.x) {
                    this.body.velocity.x = this.speed;
                }

                if (this.y > Game.player.y && this.body.blocked.down) {
                    this.body.velocity.y = -600;
                }
            }
        }
    }
};

Game.update = function () {
    game.physics.arcade.collide(Game.player, Game.layer);
    //game.physics.arcade.collide(Game.player, Game.enemies);
    game.physics.arcade.collide(Game.enemies, Game.layer);
    //game.physics.arcade.collide(Game.enemies, Game.enemies);

    Game.player.body.velocity.setMagnitude(Math.min(1000, Game.player.body.velocity.getMagnitude()));

    if (Game.cursors.left.isDown) {
        Game.player.body.velocity.x = -500;
    } else if (Game.cursors.right.isDown) {
        Game.player.body.velocity.x = 500;
    } else {
        Game.player.body.velocity.x = 0;
    }

    if (Game.cursors.up.isDown && Game.player.body.blocked.down) {
        Game.player.body.velocity.y = -600;
    } else if (Game.cursors.up.isDown && Game.player.body.touching.down) {
        Game.player.body.velocity.y = -600;
    }

};

Game.findTiles = function (id, destroy) {
    var mapArray = Game.spawn.getTiles(0, 0, game.world.width, game.world.height);

    var found = [];

    var needToFindID = id;

    for (var blocks in mapArray) {
        if (needToFindID == mapArray[blocks].index) {
            found.push([mapArray[blocks].x, mapArray[blocks].y]);
            if (destroy) {
                Game.map.removeTile(mapArray[blocks].x, mapArray[blocks].y, Game.spawn).destroy();
            }

        }
    }
    return found;
};

function randomInt(min, max) {
    return Math.floor(Math.random() * (max - min + 1) + min);
}

Any help would be greatly appreciated.

[samme]

I only see collisions against Game.layer. Are there others?

Try adding one layer at a time, set layer.debug = true, and verify the collision faces.

Also try it without layer.setScale().

[Wingzgaming]

Thanks for the fast reply, I will try that but I only want collision with Game.layer as the background is just decoration.

[Wingzgaming]

After add Game.layer.debug = true; I found that when there was a background layer the layer did not show up as collide-able even if I turned off scaling.

I attached the images in this order(With Layer.debug): Before background was added, After background added, With only the collide-able layer and finally without scaling

[samme]

So what's the problem? I don't quite understand yet.

[Wingzgaming]

Sorry if I was unclear but the issue is that collision won't work with the layer if there is another layer beneath it in the tilemap file

[Wingzgaming]

So what I'm trying to say is that collision only works with the bottom layer of the tilemap file

[samme]

Add a layer argument in setCollisionByExclusion. If omitted, it's the current layer, which is the last one you added.

[Wingzgaming]

Thank you, that worked