Hi,
I’m building a top-down RPG and I want the player to collide with some doors defined in an object layer in Tiled. I had this:
// inside my create function
const doorObjects = map.createFromObjects("Objects", {
key: "door", // the image to show, defined in preload
name: "door", // property set in Tiled
classType: Phaser.GameObjects.Image
});
const doors = this.physics.add.staticGroup();
doors.addMultiple(doorObjects, true);
this.physics.add.collider(this.player, doors,
(player, door) => {
if (player.body.touching.up && !player.body.wasTouching.up) {
console.log('collision with', door);
}
}
);
The problem is that the door is adjacent to the rest of the building, so the callback only gets fired if the player only touches the door and not the rest of the building. That way, the first collision gets detected but the second does not, which is annoying because you have to hit the door dead center.
I thought about expanding the doors’ hitboxes by adding:
// ...
doors.addMultiple(doorObjects, true);
doors.children.entries.forEach((door) => {
door.body.setSize(door.body.width + 20, door.body.height);
});
// ...
This does make the bounding box bigger, but collisions like this (when the player is touching any other part of the building) are still not being detected:
Lastly, making the doors’ bodies + 1 px in height does make the collision fire whenever the player touches up any part of the door (left), but it also makes you collide when walking from the side (right):
Is there any way around this?
Thanks and sorry for the long post