Skip to main content

Quick Radial Blurring w/ Java2D

Posted by joshy on July 26, 2004 at 11:29 AM PDT

I have to say that Java2D is amazing simply for it's productivity. The other day I was watching the psychedelic display in iTunes when I thought, I wonder how hard it would be to do that? I know it's a blurred and stretched out from the center, but that was pretty much it. I found some demoz that did something similar but I didn't feel like pawing through badly documented C++ code to figure it out. Instead I went to Java2D and wrote this in about half an hour:

Java2D already has routines for blurring, image scaling, and compositing. I just had to pull them together. Here are the important lines. The rest of the code is just boiler plate for the animation thread.

First I created a kernel, which is the
actual grid of numbers that make up a convolve operation. Each pixel after the operation will be based on the old one, plus the ones directly next to it. In this case, half of the new pixel's color will come from the old pixel and then 0.1 will come from each of the four adjacent ones. However, 0.5 + 0.1 * 4 = 0.9, not 1.0. This means the new pixel will be slightly darker, and over successive operations the whole screen will fade to black. If the background is already black, then the image will essentially fade away, which is exactly what we are looking for.

BufferedImage src, buf;
float angle;

public void paintComponent(Graphics g) {
    // create blur kernel
    float[] my_kernel = {
        0.00f, 0.10f, 0.00f,
        0.10f, 0.50f, 0.10f,
        0.00f, 0.10f, 0.00f };
    ConvolveOp op = new ConvolveOp(new Kernel(3,3, my_kernel));

Next I rotate the x and y coordinates of the martini around with sin and cos functions, creating a circle motion.

    
    // move the image in a circle
    double xoff = Math.sin(angle)*20;
    double yoff = Math.cos(angle)*20;
    angle+=0.05;

Now we get to the good part. First I draw the martini glass to the main buffer, buf, run it through the blur filter, and then draw it back on top of itself slightly larger. It's the slightly larger part that makes this a radial blur.

    // draw the martini
    Graphics bg = buf.getGraphics();
    bg.drawImage(src, (int)xoff, (int)yoff, null);
    // blur the buf image
    Image img = op.filter(buf,null);
    // draw the blurred image back on top of the main buffer
    // but scaled
    bg.drawImage(img,
        (int)(-0.0125*size),(int)(-0.0125*size),
        (int)(+1.025*size),(int)(+1.025*size),null);
    // draw it to the scree
    g.drawImage(buf,0,0,null);
}

Compile, package it up, and "http://code.joshy.org/blogs/radialblur/radialblur.jnlp">here it is in webstart form. Click to launch

If you're interested in the full code it's here
and the original martini image is
here

I'm simply amazed with the productivity of Java2D

Related Topics >>