Animate gears in C#

[animate gears]

The example Draw gears in C# explains how you can draw gears in C#. That example only needs a couple small changes to animate the gears.

The previous example starts drawing with angle theta = 0 so the first part of the gear is drawn to the right of the gear’s center. In this example the DrawGear method takes a start_angle parameter that indicates where drawing should start. The following code shows how the program sets the initial theta value.

// Draw a gear.
private void DrawGear(float start_angle,
    Graphics gr, Brush axle_brush,
    Brush gear_brush, Pen gear_pen,
    PointF center, float radius,
    float tooth_length, int num_teeth,
    float axle_radius, bool start_with_tooth)

    // Set theta for the beginning of the first tooth.
    float theta = start_angle;
    if (start_with_tooth) theta += dtheta / 2;
    else theta -= dtheta / 2;

The following code shows how the Paint event handler draws the gears.

// The angle used as the gears' origins.
private float StartAngle = 0;
private float dStartAngle = (float)(Math.PI / 90);

// Draw the gear.
private void picGears_Paint(object sender, PaintEventArgs e)
    // Draw smoothly.
    e.Graphics.SmoothingMode = SmoothingMode.AntiAlias;

    const float radius = 50;
    const float tooth_length = 10;
    float x = picGears.ClientSize.Width / 2 - radius -
        tooth_length - 1;
    float y = picGears.ClientSize.Height / 3;
    DrawGear(StartAngle, e.Graphics, Brushes.Black,
        Brushes.LightBlue, Pens.Blue, new PointF(x, y),
        radius, tooth_length, 10, 5, true);

    x += 2 * radius + tooth_length + 2;
    DrawGear(-StartAngle, e.Graphics, Brushes.Black,
        Brushes.LightGreen, Pens.Green, new PointF(x, y),
        radius, tooth_length, 10, 5, false);

    y += 2f * radius + tooth_length + 2;
    DrawGear(StartAngle, e.Graphics, Brushes.Black,
        Brushes.Pink, Pens.Red, new PointF(x, y),
        radius, tooth_length, 10, 5, true);

This code declares the form-level variable StartAngle. The Paint event handler passes StartAngle as the initial drawing angle for the two gears that should rotate clockwise. It passes -StartAngle for the gear that should rotate counter-clockwise.

To control the animation, the form includes a Timer that ticks every 10 milliseconds while it is enabled. The following code shows the Timer‘s Tick event handler.

// Increment the gears' start angle and redraw.
private void tmrRotate_Tick(object sender, EventArgs e)
    StartAngle += dStartAngle;

This code simply increments StartAngle and refreshes the picGears PictureBox to make the Paint event handler redraw the gears with their new start angles.

The final piece of new code, which is in the start button’s Click event handler, starts or stops the Timer.

// Start or stop the animation.
private void btnStartStop_Click(object sender, EventArgs e)
    tmrRotate.Enabled = !tmrRotate.Enabled;
    if (tmrRotate.Enabled) btnStartStop.Text = "Stop";
    else btnStartStop.Text = "Start";

This code toggles the Timer‘s Enabled property and then sets the button’s text appropriately.

Download Example   Follow me on Twitter   RSS feed   Donate

About RodStephens

Rod Stephens is a software consultant and author who has written more than 30 books and 250 magazine articles covering C#, Visual Basic, Visual Basic for Applications, Delphi, and Java.
This entry was posted in algorithms, animation, graphics and tagged , , , , , , , , , , . Bookmark the permalink.

2 Responses to Animate gears in C#

  1. Juan Manuel Montes says:

    What if the radius of the green gear is greater?
    The situation would be more interesting …

Leave a Reply

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