Contributing a component for image manipulation

Just committed an image component to incubator. The component makes it a little bit easier to display and manipulate images in web applications.


Quickstart:


Click here to download the component jar
and save it to your projects WEB-INF/lib

Here is a small code example that explains the usage:

Image image = new Image("http://itmill.com/res/images/itmill_logo.gif", true);
w.addComponent(image);
image.fit(150,150,true);
image.roundCorners(5);
image.rotate(350);
image.shadow(135, 5);

There is a more complete sample program here:
ImageSampleApplication.java

The image manipulation part includes:

  • Crop
  • Scale (and fit into)
  • Rotate
  • Rounded corners
  • Add a drop shadow

And the
Graphics2D
for the image is also provided, so you can easily create your own effects.

This is purely a server-side component using java.awt.* and ImageIO APIs to load the images to create the effects. The result is always rendered as PNG regardless of what format the original picture is.

There is a demo running at
http://sami.virtuallypreinstalled.com/imagecomponent/
so you can see how this works.

This seems like a great component. If just there were a central directory for all these handy components…

Btw, I noticed that if in http://sami.virtuallypreinstalled.com/imagecomponent/ you click the rotate 45 button a few times, you get a java out of heap memory error, as the image gets bigger and bigger.

Sorry. I probably made it too easy to cause this error :slight_smile:

There is a limitation how the new size is calculated for the rotated image.

It does not take account that the invisible parts of the image could be cropped while rotating. And unfortunately this 45 degrees rotate of square image is the most eager and you end up with quite a huge transparent image…

This is probably not so much a problem in other applications, but is quite annoying here.

Just rotate once, please :slight_smile:

Not that I have been able to update this lately, but Marc has found an extremely intuitive way of using this component: Image editing with the mouse gestures.

Take a look at his Wii demo:

http://forum.itmill.com/posts/list/789.page

A very intuitive way of doing some image editing :slight_smile: