Skip to main content

Use Case 2 TileMaps and Triggers

Use Case 2

Problem Statement​

We have a player, and we want it to not pass through the outer tiles of the tilemap. We will use the solid property on the tiles to add a collider. Also, we want the player to step on a trigger to show a prize.

tip

TileMaps use something called a "composite collider" to represent their collision geometry. A composite collider is a way of treating multiple pieces of geometry as one collider.

Composite Collision Resolution Strategy​

  1. 'together' - Treat all geometry as part of the same body, meaning only 1 contact is possible for the composite, and only 1 event is generated.
  2. 'separate' - Treat geometry as if it were part of separate bodies, a contact is possible for every piece of geometry, an event is generated for every contact.

Set the default for all composites as engine config

typescript
const game = new ex.Engine({
...
physics: {
colliders: {
compositeStrategy: 'separate'
}
}
});
typescript
const game = new ex.Engine({
...
physics: {
colliders: {
compositeStrategy: 'separate'
}
}
});

Or per composite

typescript
const tm = new ex.TileMap({...});
// TileMaps only have CompositeColliders
const comp = tm.collider.get() as ex.CompositeCollider;
comp.compositeStrategy = 'separate';
typescript
const tm = new ex.TileMap({...});
// TileMaps only have CompositeColliders
const comp = tm.collider.get() as ex.CompositeCollider;
comp.compositeStrategy = 'separate';

Rule of Thumb​

  • If your composite is connected and has no large gaps, use 'together'
  • If your composite is a level like a platformer with large gaps, use 'separate'

Demonstrates:

  • Tilemap colliders
  • Triggers
  • Collectibles
  • Spawning

Using the demo:

  • WASD to move the orange player
  • The gray tiles are solid
  • The black circle is a button to press
  • Pressing the button drops a coin to pick up
  • Rinse and repeat

Takeaways from this use case​

Tilemaps can set the solid property on tile for any of the tiles​

You can build whatever wall layout and each tile will have a collider on it.

Triggers can be used instead of Actors​

Triggers are a special type of entity that can be less expensive than using an actor for just triggering a collision event.