• 2D shoot 'em up
SDL2 Rogue tutorial
SDL2 Gunner tutorial
SDL2 Shooter 2 tutorial
SDL2 Widget tutorial
SDL2 Adventure tutorial
— 2D Shoot 'Em Up Tutorial —
Note: this tutorial builds upon the ones that came before it. If you aren't familiar with the previous tutorials in this series you should read those first.
We now have collision detection and can shoot the enemies to destroy them! Unpack the code and then type make to build. Once compiling is finished type ./shooter07 to run the code.
A 1280 x 720 window will open, with a near-black background. A spaceship sprite will also be shown, as in the screenshot above. The ship can now be moved using the arrow keys. Up, down, left, and right will move the ship in the respective directions. You can also fire by holding down the left control key. Enemies (basically red versions of the player's ship) will spawn from the right and move to the left. Shoot enemies to destroy them. Close the window by clicking on the window's close button.
Inspecting the code
To start with we're going to update defs.h to add a side declaration. This will come into effect when firing bullets.
In order to test whether or not a bullet has hit an enemy, we need to do some collision detection. We've added a new compilation unit called util.c, which contains a single function - collision:
This function takes 8 arguments, essentially two rectangles. It tests to see if the rectangles overlap and if so, returns 1. This is a very common test, so we won't go into details as to how it works (there are many, many such collision detection routines to be found around the web).
Next, we'll take a look at some other minor changes, starting with structs.h. In the Entity struct, we've added a new variable called side. This will use one of the SIDE_ declarations from defs.h.
We see this side variable in action in stage.c, where we've added it to the initPlayer, spawnEnemies, and fireBullet functions (some context of each omitted):
Next, we want to update doFighters, to tell the function to delete a fighter if its health is 0. This is a simple change:
We then add a new test to doBullets. As well as deleting a bullet if it leaves the right-hand side of the screen, we'll call a new function called bulletHitFighter, passing over the bullet. This function will be used to, as the name suggests, test to see if the bullet has hit made contact with a fighter.
Let's take a look at the bulletHitFighter function:
What this code does is step through all the fighters in our stage linked list and calls our collision function. We pass over the bullet's x, y, w, and h, as well as those of the fighter's, to the function. These represent the two objects' rectangles and will be used to check for an overlap. If the two rectangles do overlap, we set both the bullet's and fighter's health to 0, thus eliminating them from the game. One very, very important additional check is to see who the bullet belongs to. If we don't do this then the bullet will kill the issuing fighter as soon as it is fired. In effect, the player will press fire to die! This is why we added the side variable to Entity, to prevent such a thing happening. To sum up, if we see that the bullet is on the same side as the fighter that issued it, we'll ignore it (there will be further consequences for this in the next tutorial).
Finally, we need to ensure that the enemy fighters have health. If we don't do this they'll be removed the instant they are spawned.
We can now shoot the enemies and defeat them! Great. In the next tutorial we'll add some challenge to the game have the enemies shoot back at (and destroy!) the player.
The source code for all parts of this tutorial (including assets) is available here:
It is also available as part of the SDL2 tutorial bundle (with on-going updates):
If you do not wish to create an itch.io account, you can also purchase the tutorial bundle using PayPal. This method will be slower, however, as it will require manual verification of the transaction.
Share your comments and thoughts below. All comments are anonymous and cannot be edited.