If you've ever made a Java program that requires rapid redrawing of the screen, you've likely seen the incredibly annoying screen flicker. This is caused because when you draw using the paint method, Java draws each component one at a time. For example, say you were drawing a white rectangle as your programs background, and on top of that, a number that is constantly incremented. Java would draw the rectangle first, leaving the whole area white, and then it would draw the text on top of it. When “repaint()” is called, Java would draw the rectangle again, causing the area to be white for a spilt second, and then draw the text again. Run at a considerably fast speed, the time in between the drawing of the rectangle and the drawing of the text will become more noticeable, thus the flicker.
How can we get past this problem? One word, Double Buffering. Okay, so maybe that's two words. Even so, it's a very effective way of reducing, if not eliminating the screen flicker. When you double buffer in Java, Java creates a virtual image, draws all the components onto it, and then displays the image. That way, you only see the completed image, and animation looks smoother.
Double buffering can be accomplished by simply adding a couple things in your code. First you will need to make a new Image which will serve as the temporary image that you draw to. Then you need to get that image's graphics so that you can draw to the image. Finally, you would draw the completed image to the screen. This code, taken from the sample program below, demonstrates how you could do that.
public void paint(Graphics g){
Image bufferImage = createImage(this.getSize().width, this.getSize().height );
Graphics bufferGraphics = bufferImage.getGraphics();
bufferGraphics.setColor(new Color(255, 255, 255));
bufferGraphics.fillRect(0, 0, 300, 300);
bufferGraphics.setColor(new Color(0, 0, 0));
bufferGraphics.drawString(counter+"", 100, 100);
g.drawImage(bufferImage, 0, 0, this);
counter++;
repaint();
}An explanation of the above code can be found further on in this article, when we take a look at a sample program that uses this technique. By now though, you may have all the information you need to fix the screen flicker. If not, or if you'd like to see the code in action, check out the next section.
The Double Bufferer
This is a simple program written to show how double buffering can be used in Java. It's only function is to display a constantly incrementing number which, in a way, is an animation. Note: The lines starting with “//” are comments and are not important to the code. They simply divide the code into smaller sections so that they can be explained easier.
import java.awt.*;
import java.awt.event.*;
import javax.swing.*;
class DoubleBufferer extends JFrame{
//Code Block 1
int counter;
public static void main(String args[]){
new DoubleBufferer();
}
DoubleBufferer(){//Code Block 2
setTitle("Java Double Bufferer");
setSize(300, 300);
setVisible(true);//Code Block 3
this.addWindowListener(
new WindowAdapter(){
public void windowClosing(WindowEvent we){
System.exit(0);
}
}
);
}
//Code Block 4
public void paint(Graphics g){
Image bufferImage = createImage(this.getSize().width, this.getSize().height );
Graphics bufferGraphics = bufferImage.getGraphics();
bufferGraphics.setColor(new Color(255, 255, 255));
bufferGraphics.fillRect(0, 0, 300, 300);
bufferGraphics.setColor(new Color(0, 0, 0));
bufferGraphics.drawString(counter+"", 100, 100);
g.drawImage(bufferImage, 0, 0, this);
counter++;
repaint();
}}
Here's a brief explanation of that segment of code:
Code Block 1:
This is simply where we declare the integer “counter”, which is the variable we increment to show animation.
Code Block 2:
We use “setTitle()” to set the text in the in the title bar to “Java Double Bufferer”. “setSize(300, 300)” changes the size of the window to 300 by 300 pixels. Finally, “setVisible(true)”, as the name suggests, makes the program's window visible on the screen.
Code Block 3:
This section of code terminates the program if the user closes it via the close button on the top right, pressing alt+f4, or some other means.
Code Block 4:
This is the main part of our program. Here, we create an image called “bufferImage” with the width and height being the size of the program's window. “this.getSize()” simply returns both the width (using getSize().width) and height (using getSize().height) of the program's window. Next, you create a new graphics object called “bufferGraphics” and get the graphics from the “bufferedImage” using “getGraphics()”.
We set the drawing color to white with “setColor(new Color(255, 255, 255))”, and then we draw a rectangle the size of the program's window using “fillRect()”. Then we change the color to black with “setColor(new Color(0, 0, 0))”, and use “drawString()” to draw the value of “counter“. The reason we have to write “drawString(counter+””)” is because “drawString()” only draws strings. “counter” is an integer and Java will throw an error if we try to draw it. Adding a string to counter (done by adding “”) makes Java display it as a string.
Finally, after everything's been drawn to our temporary image “bufferedImage”, we can display the whole thing at once, completely removing the flicker, using “drawImage()”.
Once that's all done, the only thing left to do is increment “counter”, which is done by “counter++”, and then call “repaint()”, which will repaint everything and start the process over.
Practical Uses for Double Buffering
As mentioned at the outset, double buffering is very effective in removing the screen flicker that occurs when the screen is rapidly redrawn. Games, movies, animations, and other programs that require frequent screen refreshing often benefit by using this method.
With any luck, you should feel more confident when it comes to double buffering. Thanks for checking out this article, and if you've got any suggestions, don't hesitate to leave a comment.
