Forum

The terrain

Now that we have a background where some of the pixels’ Opacity component have been altered, it’s time to draw our terrain on top of it.

In , the terrain are buildings that gorillas are perched on top of. That basically means several squares of different shades. What your terrain looks like and how you draw it doesn’t really matter that much; the important part, once again, is the way we blend it into the existing render buffer.

What we’re going to do now is draw every pixel of the terrain on top of the background pixels, except for where the background pixels aren’t fully opaque. Where the background isn’t fully opaque, we want to draw our buildings with the Opacity of the background pixels. So basically we switch the Opacity values of the terrain and background pixels around to compose the resulting pixel. That will make sure that where the background is opaque, we draw an opaque terrain pixel on top, but where the background is not opaque, we blend a terrain pixel into it, where fully transparent background pixels result in no terrain pixel data being added to the mix.

In the code for I actually draw the buildings twice with a different blend. The first time, I draw it as explained above, the second time I draw them using a different blend, which causes the second draw to only apply pixels where the render buffer contains non-opaque pixels. That causes the second render to draw pixels where there are holes. I use this to draw the back of the building, to illustrate having blown the front off of a building. I also use some blending trickery when drawing the front of the buildings to set the render buffer’s Opacity to 1 where I have windows in the building without drawing the windows where there are holes. That means, when I draw the back of the building later, I’m not drawing any back pixels where I set the opacity of the background to 1 (for the windows), meaning the back of the building will have square holes in it where there used to be windows (blown out windows).

See:

Finishing touches

After all that’s done we basically have a nice background that we can do whatever with (use whatever content and animate it if we like), draw invisible holes on top of that which change the opacity of the background pixels, draw a terrain on top of that using the opacity of the existing background pixels, and optionally drawing an alternative destroyed terrain on top of that using the opposite of the opacity of the existing render buffer pixels.

We now have destructible terrain; but we should probably add some finishing touches to it. In I use a particle emitter to draw flames and explosions.

Collision detection

For collision detection we really just need to implement a way of checking whether a certain point collides with the terrain and whether it collides with an explosion.

Then, we can just check whether the point collides with our terrain and does not collide with any of our holes. It’s a simple loop of checks and shouldn’t be too expensive at all. Your hole collision detection will probably just check the distance between your hole’s center and the point, and your terrain detection’s complexity will depend on what your terrain looks like. just uses rectangles, so it’s pretty simple.