Episode 5 - Basic Collision Detection.

For this episode we are going to create a basic collision detection mechanic, for this episode we will be using collision detection that see’s when two rectangles intersect.

To do this I have made a simple pong-style game with two character movable paddles. Instead of a ball in going to use a picture of Philip Defranco a YouTube vlogger that I enjoy watching, if you’re not familiar with his show you can see it here – Philip Defranco on YouTube.

Click “Read more” for how it’s done.

The majority of this episode is done by implementing techniques that have been used in previous episode, so if you’re having issues displaying a sprite or moving it on the screen watch the previous episodes.

The main difference here is that we are going to create a rectangle around our paddles (which would be our hero in our game) and detect when it intersects with the ball and then we will reverse the balls direction.

Step 1:

Create your sprites – you will need one for the ball and one for the paddles, I have used the same image for both paddles, but you can use a different picture for each if you like (afterall, it’s your game).

Step 2:

We need to declare our variables, so we are going to need a “Vector2” for both of the paddles, a “Texture2D” for the paddles and the ball, an “int” to track the x and y speed of the paddle and ball.

Step 3:

We need to load the assets, you should already know how to do this. If not go back to previous episodes.

Step 4:

Here I have initialized the starting positions and speeds.

Step 5:

We need to draw our sprites to the screen using the “Draw” method. Once again, you should be familiar with this already.

Step 6:

Now we need to use our “Update” method to track and move the game mechanics.

Here we are using “ballspeedx” for the horizontal speed of the ball and “ballspeedy” for the vertical speed.

For this test we are setting the x and y speeds of our ball a 3.

We make the ball move using the line ball_pos.X += ballspeedx;

Which is another way of saying that the ball’s X position if equal to the ball’s position plus the balls speed, which we have set to 3, so every time our “Update” method runs the ball is moves 3 pixels either left or right.

(I’m not sure if this is technically correct, however this is how I think it works.

Also in this method we are creating our rectangles to contain our paddles assigning the x an y position that of the paddle, while we have used rectangles in previous episodes you will notice for this that we are changing the data type inline, this is because the arguments that the rectangle handler takes is an “int” and a “Vector2” is a float. (Took me waaayyyy too long to work this out).

Then we have some “if” functions that we are using for our collision detection. Luckily for me XNA has an inbuilt function (Not sure it that’s the correct term for it) that allows us to test whether rectangles are intersecting.

To do this we simply use:

if (paddle1_rect.Intersects(ball))

{

// add logic here;

}

I think this is fairly straight forward, but if you have any questions don’t hesitate to get in touch.

I have also implimented a check to see if the ball has hit either the top of bottom then the ball bounces back into play.

And you should be done.

And that’s about it, We have what is almost a fully functioning game to play whilst this isn't the game style I set out to make I think the skills I have learnt here will be easily applied to the platformer.

Due to an issue with my hosting company, the source code will be found at a new location, see the link on the side. <-----------------------------------

Untill next time,

Lets make a video game.

Christo.