Intro to Programming Excercise: Bouncing Balls

This article is the beginning of a new 'Introduction to Programming' topic for my blog.  The BouncingBalls example.

Basically, I have decided to try to teach programming to a set of teenagers from my son's junior high school, and this topic will be a set of instruction materials for that 'course'. 

The basic premise is simple:  I think that the .NET Runtime is a great platform for teaching kids about programming, and I personally want to see my son and his classmates get the chance to do some 'hands-on' programming.   

The good news is that the .NET Runtime is free for any users of the Windows operating system.  The Windows VISTA has it preinstalled.   If the directory c:\windows\Microsoft.NET\Framework\v2.0.50727 exists you already have this software on your system.  If you don't you can get the .NET Runtime is part of the 'optional downloads' from windows update.  Click on 'custom' and look for the option to download '.NET Framework 2.0'.   You can also get it from the .NET downloads site.  

One very nice characteristic of the runtime is that it comes with EVERYTHING you need to build and run a really LARGE set of applications.   We will take advantage of that here.   To help motivate my teen-age students, my programming examples will be very visual.  We will be writing various simple game programs (and leaning some programming along the way).   I will be teaching them the C# language.

Note that actually writing on-line content that goes with the examples here is probably too much for me to do.  It takes a lot of time to write a really good explanation.   However the code samples I will be posting are fun and useful.   For those who know something about programming, there is a good chance you can pick up and read the code I post and learn something new about System.Windows.Forms and GUI programming. 

The first example program is my 'Bouncing Balls' example.  This program is a physics simulation of some balls bouncing around a box.  Balls can bounce off the walls and each other.   This is just an example of what can be done.  Within 10 minutes of staring the project I had something interesting on the screen (a ball bouncing off a wall),   It took me another 3 evenings to get the code to add all the bells and whistles (collisions with other balls, the buttons, color, faces for the balls, etc).   We will be starting with some simpler 'ramp up' programs shortly, but I wanted to show something compelling that people could play with immediately

The attachment is a ZIP archive that holds ALL the files needed to create the program from scratch.   There is NOTHING missing.  To unpack the archive, first double click on it, and it will open, showing a directory called 'BouncingBalls'.   Copy this directory to your local hard drive by opening dragging it to where you want to put it (e.g., you can just drag it to the desktop if you like, or put it in your 'My Documents' folder).  Once the BouncingBalls directory is on your machine, you can open it up, and you will find all the files.  

The 'heart' of the program is in the file 'MainForm.cs', in the 'BouncingBalls' subdirectory.  Ideally, you should have an editor designed for looking at code to look at MainForm (e.g. Visual Studio), but if you don't have one, you can look at it using the 'notepad' editor.  There are two main routines to the program.  The first is the 'timer_Tick' method that updates all the balls on the screen every 20 msec, and the other is the 'MainForm_Paint' routine that is called any time the window needs to be redrawn.    Hopefully this is enough of a starting point of people who have seen C# before to get their bearings. 

To actually compile and run the program, you need only double click on the 'BuildAndRun.bat' file in the BouncingBalls directory.   Note that after the program has been built into an EXE you don't need to do it again, you can launch the program by simply double clicking on the EXE that was built (it gets built into BouncingBalls\bin\Release\BouncingBalls.exe).   Only if you change the code do you need to rebuild.   You can also copy the EXE anywhere you like and run it from there (for example you can drag it to your desktop so you can launch it easily). 

Give it a try.   Play with the GUI.  After you have played with it a bit see if you can do the following changes

  • In mainform.cs you will find the line 'timer.Interval = 20;' This controls how often updates happen.  Update this so that updates happen only half as often as before, and then recompile and run the program (double click on BuildAndRun.bat).   See what happens. 

  • In the same routine you will find code for the initial number of balls.  What is the current default?  Change it to 20.  Se what happens.

  • In the 'DrawFace' method you will find a variable called 'eyeRadius' which determines the size of the eyes.  Make the eyes twice as big as they were originally.  See what happens.   

  • The colors for the balls are determined by an array called 'colors'.  Find this array, and remove any colors you don't like. 

Next time we will go through step-by-step building up to making this application.

Comments (4)

  1. wtftc says:

    I have to say that I"m a little bit jealous. I wish I had an opportunity to take a class taught by you when I was in middle school (junior high if you’d like).

    As a substitute, keep up the posts. I love performance tidbits of any sort.

  2. razieh says:


    can you do it with multi threads?

    & also like this: first there is one ball,when it crashed to wall it become 2,3,4,…

    with regard

    plz answer to my mail

  3. vancem says:

    Sure all that is possible.   Using mulitple threads however is tricky, espeically with GUI stuff (since you are not allow to make any calls that paint or interact with user APIs execpt on one thread.    However you could certainly offload the calculations of where each ball position and velocity to other threads and use the GUI thread just for painting.

    If you do this you will find the CLR 4.0 version to have a lot of useful (see…/default.aspx for more)

  4. mnorgate says:

    How would you go about adding gravity into this

Skip to main content