2012-04-29

Ken Burns effect using Java Applet


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.