Professional HTML5 Mobile Game Development

Handling Platformer Collisions

As mentioned earlier, collision detection in a platformer needs some special attention. The first issue, as described already, is that, given the size of levels, collisions between sprites and tiles need to be highly optimized. A second requirement is that the collision detection should be stable and reasonably accurate. Because sprites spend most of their time hanging out on, well, platforms, the engine should be optimized for this case. Sprites will also be running around jumping and generally causing a ruckus. As the sprites run into things, they need to get feedback based on the direction of the impact.

Building a physics engine that does realistic collision calculations and responses to collisions is both difficult and processor-intensive. A simpler solution is to build a simplified model of how a sprite should react to collisions that is easier to implement and less work on the processor.

Taking a hint from the old-school platformers of yesteryear, sprites can be treated as a rigid collection of points that represent the extents of the object. If each point is also given a position label like top, left, right, or bottom, and if that point collides with something, it’s easy to determine the reaction the sprite should have. If the top of the sprite collides with an object, the engine can just move the sprite down until it’s no longer in contact. The same applies for each of the other directions. See Figure 18-1.

Figure 18-1: Collision detection. ...