Months ago, I feel fascinated by the panning and zooming
effect of displaying photos on video.
Later on, I know this is called Ken Burns effect, after the
"inventor" (see wiki).
I want to implement similar effect on web page photo
album. However, I cannot find any free
flash tools. Then I ask myself: why not
write a Java applet myself? (Inconvenient fact: I do not know anything about
flash programming.)
Then I start my journey of exploring Java API on
graphics. My first version is using the java.awt.Graphic
class, which is natively included in applet since day 1.
The pseudo codes are very simple as follows:
- load the jpeg file (by the way, I do not like the lack of control of the default MediaTracker and has created a new class imageretriever using SwingWorker)
- start a thread which periodically update the graphics
- the thread uses the Graphics.drawImage method which supports the scaling
However, I find that the painting is not smooth (the upper
left is updated first and the lower right portion is updated later - this
phenomenon is more prominent for large display area.
Later on, I find this phenomenon can be overcome by the "Double
Buffering" technique. So, instead of
directly calling Graphics.drawImage, the pseudo codes are changed as follows:
- create a BufferedImage object, which is derived from getImage from the original image
- since I find that the BufferedImage so created is not a deepCopy of the original, further scaling will affect the source, I further created another BufferedImage and use Graphics2D.drawImage to "copy" the source
- finally use Graphics.drawImage to paint the scaled image to the applet
To my disappointment, I find that the gradual scaling on
some fine-grained image has the so called staircase effect. Therefore I further try to use the Bicubic
interpolation to "blur" the zoomed image. But the effect is not very satisfactory.
The result can be found at here. Because the applet window is not large, the
reader may find the difference is not very significant.
