Make a bouncing ball animation in C#

[animation]

This example shows how to make a bounding ball animation. When the form loads, the following code executes.

// Some drawing parameters.
private const int BallWidth = 50;
private const int BallHeight = 50;
private int BallX, BallY;   // Position.
private int BallVx, BallVy; // Velocity.

// Initialize some random stuff.
private void Form1_Load(object sender, EventArgs e)
{
    // Pick a random start position and velocity.
    Random rnd = new Random();
    BallVx = rnd.Next(1, 4);
    BallVy = rnd.Next(1, 4);
    BallX = rnd.Next(0, ClientSize.Width - BallWidth);
    BallY = rnd.Next(0, ClientSize.Height - BallHeight);

    // Use double buffering to reduce flicker.
    this.SetStyle(
        ControlStyles.AllPaintingInWmPaint |
        ControlStyles.UserPaint |
        ControlStyles.DoubleBuffer,
        true);
    this.UpdateStyles();
}

This code initializes the ball’s position and velocity to random values. It also turns on the form’s DoubleBuffer style to reduce flicker.

When the form’s Timer fires its Tick event, the following code moves the ball.

// Update the ball's position, bouncing if necessary.
private void tmrMoveBall_Tick(object sender, EventArgs e)
{
    BallX += BallVx;
    if (BallX < 0)
    {
        BallVx = -BallVx;
        Boing();
    } else if (BallX + BallWidth > ClientSize.Width)
    {
        BallVx = -BallVx;
        Boing();
    }

    BallY += BallVy;
    if (BallY < 0)
    {
        BallVy = -BallVy;
        Boing();
    } else if (BallY + BallHeight > ClientSize.Height)
    {
        BallVy = -BallVy;
        Boing();
    }

    Refresh();
}

This code adds the ball’s velocity (in pixels per timer interval) to the ball’s position. If the ball crosses a form edge, the code switches the velocity’s component in the corresponding direction (depending on which edge it hit). It also calls the Boing method described later.

After moving the ball, the code invalidates the form to make the following Paint event handler redraw the ball at its new position.

// Draw the ball at its current location.
private void Form1_Paint(object sender, PaintEventArgs e)
{
    e.Graphics.SmoothingMode = SmoothingMode.AntiAlias;
    e.Graphics.Clear(BackColor);
    e.Graphics.FillEllipse(Brushes.Blue, BallX, BallY,
        BallWidth, BallHeight);
    e.Graphics.DrawEllipse(Pens.Black, BallX, BallY,
        BallWidth, BallHeight);
}

When the ball hits a form edge, the following Boing method plays an audio resource.

// Play the boing sound file resource.
private void Boing()
{
    using (SoundPlayer player = new SoundPlayer(
        Properties.Resources.boing))
    {
        player.Play();
    }
}

This code simply creates a new SoundPlayer associated with an audio resource and calls the player’s Play method.

For more information on creating and playing audio resources, see Play an audio resource in C#.


Download Example   Follow me on Twitter   RSS feed   Donate




This entry was posted in animation, audio, multimedia and tagged , , , , , , , , , , , , . Bookmark the permalink.

4 Responses to Make a bouncing ball animation in C#

  1. Pingback: Animate several bouncing balls in C# - C# HelperC# Helper

  2. Kevin Jonathan says:

    What is ‘Boing();’ there ?

    • RodStephens says:

      The last piece of code in the post shows the Boing method. It plays a sound resource named “boing” that plays a springy bounding sound.

      To add a sound resource to a project, open Project Explorer, double-click Properties, and select the Resources tab. Open the Add Resources dropdown and select Add Existing File. Select the file that you want to add and click Open.

      Now your program can use the resource as shown above.

Leave a Reply

Your email address will not be published. Required fields are marked *