# Creating a Pong Game

Thursday Jun 5th 2008 by Jorge Tiago Vila
Share:

It's a simple game, but this tutorial will get you playing in a very short time.

Pong: one of the simplest possible games to make. If you're doing an assignment, or just want to start making games, this tutorial will get you up and running with a working game ASAP.

It assumes you know how to add controls in the designer and switch between the designer and code views.

### 1. Starting Up in the Designer

Make three picture boxes (one player paddle, one computer paddle, one ball). Name and position them accordingly: playerPaddle at the bottom, computerPaddle at the top, ball in the centre. Add a timer with an Interval value of 50, and an Enabled value of true. Double-click the timer.

### 2. Moving the playerPaddle

Now, add the following:

```playerPaddle.Location = _
Me.PointToClient(New Point(MousePosition.X, _
```

This will move the bottom paddle to be in line with the mouse every update. If you run it now, you should have a controllable bottom paddle.

Me.PointToClient converts the Sceen Coordinates of MousePosition.X to Form1 Coordinates. This means that it won't affect the gameplay if you move the form around.

### 3. Declaring Ball Speed Variables

Add this code directly to your namespace (not in the timer event handler):

```Dim ballXSpeed As Single
Dim ballYSpeed As Single
```

This sets aside two variables for use later on.

### 4. Initialising Ball Speed Variables

Go back to the designer and double-click the form. In the Form1_Load event handler, add:

```ballXSpeed = 0
ballYSpeed = -5
```

This initialises the ball speed variables. It will immediately move in the negative Y direction (towards the computer).

### 5. Applying Ball Speed Variables

Back in the timer event handler, add:

```ball.Location = New Point(ball.Location.X+Math.Round(ballXSpeed), _
ball.Location.Y+Math.Round(ballYSpeed)
```

This adds the balls X and Y speeds to the ball's location every frame. If you run the program now, you should see the ball fly off the top of the screen.

### 6. Determining Collision with the playerPaddle

This is more complex. You need to check whether or not the ball's position is within the paddles bounding box. To do this for the player's paddle, add:

```'Checks that the ball's X position is within the left/right edges
If ball.Location.X < playerPaddle.Right And ball.Location.X > _
'Checks that the ball's Y position is within the top/bottom edges
If ball.Location.Y < playerPaddle.Bottom And ball.Location.Y > _
'A collision has occurred
End If
End If
```

Read this code thoroughly to understand how it works before you continue.

### 7. Acting on Collision with the playerPaddle

When the ball collides with the playerPaddle, you want it to go up, towards the computerPaddle. Hence, you modify the ballYSpeed within the collision check:

```'A collision has occurred
ballYSpeed = -10
ballXSpeed = New Random(DateTime.Now.Millisecond).Next(-10,10)
```

This also randomises the X speed of the ball, to make things more interesting. The new Random class takes DateTime.Now as a seed, to prevent it always returning the same pseudorandom number everytime it is initialised.

### 8. Collisions with the computerPaddle

This is almost identical to collisions with the playerPaddle, but the ballYSpeed is changed to the opposite value to send it back to the player:

```If ball.Location.X < computerPaddle.Right And ball.Location.X > _
'Checks that the ball's Y position is within the top/bottom edges
If ball.Location.Y < computerPaddle.Bottom And _
ball.Location.Y > computerPaddle.Top Then
'A collision has occurred
ballYSpeed = 10
ballXSpeed = New Random(DateTime.Now.Millisecond).Next(-10,10)
End If
End If
```

If you run this now, the ball should be able to bounce off both paddles.

### 9. Computer Control

Okay, you now have a working ball, but the computer paddle doesn't put up a fight. Add:

```If ball.Location.X > computerPaddle.Left + 20 Then
'Move Right
End If

If ball.Location.X < computerPaddle.Right - 20 Then
'Move Left
End If
```

This will move the computer paddle left and right when it needs to. Run it now and you'll have a working game of Pong.

The +20 and -20 add 'error tolerance,' causing the computer player to move closer to the ball than is necessary to intercept it. This is much more like a human player than always intercepting the ball with the very edge of the paddle.

### 10. Bouncing Off Walls

If you tried to play the game, you might have noticed that the ball can fly off of the left and right sides of the screen. Making it bounce off of walls is easy enough, and takes away this bug.

```If ball.Location.X < 0 Then
ballXSpeed = 5
End If

If ball.Location.X > Me.Width Then
ballXSpeed = -5
End If
```

Your game logic is now finished!

### 11. Restarting the Game

The game plays, but will need a method to restart. Go back to the designer and add a button somewhere. Name it 'restart', and double-click it. Then, add some very simple restart code:

```ballYSpeed = -5
ballXSpeed = 0
ball.Location = new Point(Math.Round(Me.Height/2), _
Math.Round(Me.Width/2))
```

And, your game is finished! Feel free to improve on it: This is probably as simple as it gets to make a working game.

### Suggestions for Improvement and Bonus Points

• Add a win/lose test, for when the ball goes off the top and bottom of the screen.
• Mess with the Timer interval value and all the speed values to increase and decrease difficulty.
• Combine the above two suggestions: Make the game more difficult every time the player wins and less difficult every time they lose.
• Make the Computer Paddle more realistic: Add an xSpeed variable for it and add values to that variable to make it move more smoothly.
• Using a Win/Lose test, disable the restart button when you are playing.
• Using a Win/Lose test, add a score tracker using two labels and two integer variables.
• Make pretty images for the ball and paddles.

If you find any problems, let me know and I'll fix them.

Share:
Home
Mobile Site | Full Site