|
Before we start the lesson, I like to take a moment to explain what it is about. Double Buffering is a technique in animation programming, where picture is drawn ahead before being display. Normally, java applet draws picture "on-the-fly"(draw as it being display). The problem is that we seeing a lot of flickering on the screen. Here is an example (picture follows the mouse): No Double Buffering--Notice small flickering |
|
Ok, to start double buffering, we have create second Graphics
variable (called 'backg') and second Image variable (called
'buffer'). Graphics class is like a canvas that
used by Java applet to hold/display image, picture, pixel, etc.
Here we create a second Graphics that holds image that going to
be display next. For Image, it will be our paper
on the canvas. Also, whenever we draw anything on the canvas
('backg'), it will be apply to the paper ('buffer') and not the
canvas ('backg'). Anyway, the picture will be drawn on the 'buffer'
without being visible to the user. When the computer finishes
drawing the picture on 'buffer' then it will be display by
"paint(Graphics g)" function. Analogy of this would be an artist with two canvas, one for audience to view and another for himself to draw. However, the artist doesn't draw on the canvas, but draw on the paper which lay on top of canvas instead (let's assume canvas is rare and expensive). The audience's canvas will only be update after the artist finishes with his drawing on his canvas. Remember, it is the paper that this artist draws on, not the canvas itself. I think that is enough said: Double Buffering1--Still flicker |
|
Hmmm....notice that flicker is still there (I'll talk about the
tracing of the picture a little later). Why, you may wonder.
The simple answer is that Java's function "update(Graphics g)" is
constantly erasing the applet's screen before displaying the new
picture. To stop these flickers, we need to prevent "update()"
function from erasing the applet's screen every time. Double Buffering2--No flicker |
|
Okay, now that the picture doesn't flicker, we still have a problem.
It creates an image trace, look nice but what if we don't want it?
Simple. We will clear the screen before re-drawing anything. We
can do this by drawing a large rectangle to cover the old picture,
then we draw our next picture. Just in case you are curious, which you should be. The image trace appears because we are constantly drawing a new picture on the same old paper ('buffer'). That is why we need to erase everything on the paper before drawing new stuff on there. Double Buffering3--Ahhh....Perfect |
Well that is it to double buffering in Java. The trouble you might run into is that you can't put these applets (one with double-buffer) inside another applet. Well, thanks to Yuhan because he found out the solution. The reason is because getDocumentBase() and similar only work with the top-most applet. So if you want to put the finished applet into another one, create a function that store the URL.