Click here to Skip to main content
14,921,612 members
Articles / Programming Languages / C#
Article
Posted 12 May 2004

Stats

101.6K views
1.7K downloads
25 bookmarked

Anti Flicker Graphics using Double Buffering and how to make simple graphic moves.

Rate me:
Please Sign up or sign in to vote.
2.81/5 (22 votes)
12 May 20042 min read
This example will show you how to use doublebuffering and hopefully allows you to make images move across your screen.

Sample Image - screenshot.jpg

Introduction

While writing a game which I will hopefully release later on here, I had to find a way to reduce flicker. I also ran into the problem of the redraws causing the game to move extremely slow. I did some research and found out about DoubleBuffering, Timers and PaintEvents. I hope you learn from this as much as I did.

Step1: Making the Timer

  1. Go to the toolbar after you have made the basic WinForm skeleton. Select Timer and drag it to the WinForm.
  2. Right click on the Timer and hit Properties.
    1. Make sure that enabled is set to true.
    2. Make the Interval to 1.
    3. Click on the the Lightening bolt (event maker).
      • Where you see tick, add an event named moveme.
      • Now once we have an event, it will take you to the code block.
      • Add the following:
        C#
        if(CarsXValue>0)
            CarsXValue-=Carspeed;
        else
        {
            CarsXValue=672;
        }
        Invalidate();

Step2: Make a Paint Event

Now we need to make a paint event that will draw our images for us. So we do the following:

  1. Include the following in the form1() constructor:
    C#
    Paint += new PaintEventHandler(OnPaint);
  2. Then you need to actually make the Onpaint event by doing the following.
    C#
    void OnPaint(Object sender, PaintEventArgs e)
    {
        Graphics g = e.Graphics;
    
        DrawCar(g);
    }
  3. Make a DrawCar function that will draw the images for us:
    C#
    void DrawCar(Graphics g)
    {
        g.DrawImage(FastCar,CarsXValue,672);
    //draw the image using the image fastcar
    //its x value
    //and a hardcoded y value
    }

Step 3: Make Our Variables

Now we need some variables to control our movement. We also need an image to draw and a X co-ordinate that I will explain.

  1. Make the following variables where all the other main variables are declared.
    C#
    int CarsXValue=0; // x cordinate used for the car
    int CarSpeed=2; // how fast it will move across the screen
    Image FastCar=Image.FromFile("fastcar.gif"); // our car image

*****Make sure the FASTCAR.GIF is in the debug or release folder**********

Step 4: Turn on Double Buffering

We now turn on double buffering to prevent flicker. Include the following code in the Form1() constructor. And you're all set.

C#
SetStyle(ControlStyles.UserPaint, true);
SetStyle(ControlStyles.AllPaintingInWmPaint, true);
SetStyle(ControlStyles.DoubleBuffer, true);
SetStyle(ControlStyles.UserPaint, true);
SetStyle(ControlStyles.AllPaintingInWmPaint, true);
SetStyle(ControlStyles.DoubleBuffer, true);

Step 5: Compile and Run

Again make sure that the fastcar.gif is in your debug or release folder depending on which build configuration you have selected.

Conclusion:

I hope this helps you as much as it did me.

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

MeterMan
United States United States
Graduated from Kennesaw State with a Computer Informatin Systems degree. I have a fair knowledge of C++ and C# but by far am not an expert. My skills are more into software troubleshooting and repair.

Currently working as an IT Specialist for a Radio Read Meter Company.

Comments and Discussions

 
GeneralMy vote of 5 Pin
Deviant Sapphire6-Aug-12 3:05
MemberDeviant Sapphire6-Aug-12 3:05 
Questiondraw smooth moving image over Tab page? Pin
Rahul P. Shukla13-Jul-11 19:56
MemberRahul P. Shukla13-Jul-11 19:56 
AnswerRe: draw smooth moving image over Tab page? Pin
Rahul P. Shukla13-Jul-11 20:27
MemberRahul P. Shukla13-Jul-11 20:27 
QuestionDoes this apply to controls within the form? Pin
MWBate22-Jun-09 16:44
MemberMWBate22-Jun-09 16:44 
GeneralSpam charater Pin
thechien2-Dec-08 20:56
Memberthechien2-Dec-08 20:56 
GeneralReally Helpful Pin
Mohammad Ali Azam14-May-08 20:37
MemberMohammad Ali Azam14-May-08 20:37 
GeneralThank You Pin
egger1234-Dec-07 20:41
Memberegger1234-Dec-07 20:41 
Generalprevent the flickering while onpaint event Pin
stallion_the_black21-Feb-07 3:52
Memberstallion_the_black21-Feb-07 3:52 
QuestionCarsXValue haven't display on the watch when debugging !!! Pin
jobofmoses29-Mar-06 18:59
Memberjobofmoses29-Mar-06 18:59 
Questionrun successfully .... Pin
jobofmoses29-Mar-06 8:16
Memberjobofmoses29-Mar-06 8:16 
Generalwatch out for using menu controls Pin
Ruud van Eeghem6-Jan-06 4:04
MemberRuud van Eeghem6-Jan-06 4:04 
Generalthanks! Pin
JovetteDev13-Dec-05 11:27
MemberJovetteDev13-Dec-05 11:27 
Generalrepeating code Pin
NetDevKing24-May-04 6:55
MemberNetDevKing24-May-04 6:55 
GeneralRe: repeating code Pin
MeterMan24-May-04 8:48
MemberMeterMan24-May-04 8:48 

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

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