Click here to Skip to main content
Click here to Skip to main content
Go to top

How to build a breakout style game with animation and sound.

, 9 Jan 2004
Rate this:
Please Sign up or sign in to vote.
Summery of the project.
<!-- Article image -->

Sample Image - breakout_picture.png

<!-- Add the rest of your HTML here -->

Introduction

Welcome to another installment of, "Boy this guy really has nothing better to do". Smile | :) My latest creation is called Tiny Breakout. I 100% GDI+ code that runs really smooth after I stumbled across some new features. I am not going to give out the source on this for a few reasons. One I might want to release this as shareware and two because there are a few sloppy spots that I need to clean up. But, I will outline some of the new stuff I used in the creation of the animation effects and also show you how I incorporated sound without resorting to DirectX.

The Blocks

I used the basic structure I have been using now in my demos for the past few days. All the different elements (ex. ball, paddle and blocks) reside in there own class structure with the basic methods of New, Draw and Move. Some of them has special attributes such as isImpact and changeDirection.. But probably most importantly they all have a Public Location as rectangle in them to let me know where the objects are on the screen.

For instance say I needed a block for the board of the game. To create the block I simply call its new function.

'
' destPoint is a point structure of where you want to place the block
' 5 is the point value of the block
' Brushes.Blue is the color to make the block
'

Blocks(thisBlock) = New cBlocks(destpoint, 5, Brushes.Blue)

As you see I have an array of blocks and each one gets created sepritly.

The Paddle

The paddle is constructed much in the same way as the blocks (call the new procedure and it builds the paddle etc.). However, unlike the blocks the paddle needs to move.This was done with the basic mouse event.

    Private Sub game_MouseMove(ByVal sender As Object, ByVal e As System.Windows.Forms.MouseEventArgs) Handles game.MouseMove
        Paddle.Location.X = e.X - (Paddle.Location.Width / 2)
    End Sub

As you can see I don't redisplay the paddle, that's the job of the paint event. I tried something new when working with the paint event today, I started invalidating (repainting) regions of the screen instead of the whole screen like this.

    Private Sub Timer1_Tick(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Timer1.Tick
        Dim PaddleInvalidate As Rectangle = New Rectangle(0, Paddle.Location.Y, game.ClientSize.Width, Paddle.Location.Y + 10)

I set a rectangle equal to the entire segment where the paddle could be.

        game.Invalidate(PaddleInvalidate)
        game.Update()
    End Sub

Then I tell it I want to redraw that segment of the screen and it needs to do it now. The paint event is then called and it executes paddle.draw(e.graphics) creating a seemless animation.

The sound

Here i a copy of the class I built based on a few usenet postings.

Imports System.Runtime.InteropServices

Public Class cSound
    Private Const SND_SYNC As Int32 = &H0
    Private Const SND_ASYNC As Int32 = &H1
    Private Const SND_FILENAME As Int32 = &H20000

    ' Import the Windows PlaySound() function.
    <DllImport("winmm.dll", EntryPoint:="PlaySound", CharSet:=CharSet.Auto, SetLastError:=True)> _
    Private Shared Function WinPlaySound(ByVal pszSound As String, _
                                         ByVal hmod As Int32, _
                                         ByVal fdwSound As Int32) As Boolean
    End Function

    Public Sub playSound(ByVal filename As String)
        Dim path As String = Mid(Application.ExecutablePath, 1, InStrRev(Application.ExecutablePath, "\"))
        If IO.File.Exists(path & "\" & filename) Then
            WinPlaySound(path & "\" & filename, 0, SND_FILENAME Or SND_ASYNC)
        End If
    End Sub

End Class

when I want to play a wav file all I have to do is:

Public sound As New cSound
sound.playSound("click.wav")

The status bar at the top of the screen

The status bar is actually a border less form. I created a 300x20 pixel form, set the opacity to 65% and positioned on the top of the game board for tracking Lives, Score and Level information.

The rest

The balls class i'm going to keep under wraps for a while but I will give you a hint on the animation side. When the timer ticks I just game.invalidate(ball.lastPos) and game.invalidate(bball.newPos).

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here

Share

About the Author

Matthew Hazlett
Web Developer
United States United States
I started programming for fun when I was about 10 on an Franklin Ace 1000.
 
I still do it just for fun but it has gotten me a few jobs over the years. More then I can say for my Microsoft Certifications. Smile | :)
 
The way I learned was by example, now its time to give back to the next generation of coders.
 


Comments and Discussions

 
GeneralMy vote of 5 PinmemberHeaven20203-Nov-10 6:59 
GeneralGreat Job PinsussAnonymous8-Apr-04 18:49 
GeneralDon't take this the wrong way but... PinmemberPaul Ingles11-Jan-04 4:03 
GeneralWell said Pinmemberdog_spawn11-Jan-04 5:53 
GeneralRe: Well said Pinmemberhazlema11-Jan-04 7:35 
GeneralRe: Well said PinmemberPaul Ingles11-Jan-04 8:25 
GeneralRe: Well said Pinmemberhazlema11-Jan-04 9:06 
GeneralRe: Well said PinsussAnonymous11-Jan-04 11:13 
GeneralRe: Well said Pinmemberdog_spawn11-Jan-04 8:46 
GeneralRe: Well said Pinmemberhazlema11-Jan-04 9:08 
GeneralPointless even trying Pinmemberdog_spawn11-Jan-04 14:15 
GeneralRe: Don't take this the wrong way but... PinmemberNetDevKing24-May-04 7:15 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Mobile
Web02 | 2.8.140916.1 | Last Updated 10 Jan 2004
Article Copyright 2004 by Matthew Hazlett
Everything else Copyright © CodeProject, 1999-2014
Terms of Service
Layout: fixed | fluid