 |
Zoom Pictures with SwingLabs FX
Posted by gfx on September 03, 2005 at 01:25 AM | Comments (13)
Zoomable Image Panel
I read many Java forums and answer to a lot of questions about Java and Swing people send me by email. During the past few years, I've often seen users asking how to create a component which would let you display an image but also zoom in and out. I decided to take advantage of the SwingLabs FX module I recently introduced to provide such a component. As FX contains nice effects, I took my chance to mix everything together.
This new demo is very similar to the one I made to present the CheckboardPanel and DropShadowPanel components. It actually uses them for better graphical result:
When you run the application, a picture is loaded into a org.jdesktop.swingx.ZoomableImagePanel. You can use the mouse wheel to zoom in or out but you can also drag the slider on the left. Here is an example with the same image zoomed in:
The API
While the component is still a bit crude, the API is really simple to use. Here is how you can create a new zoomable image with a zoom factor of 10% and a zoom level comprised between 25% and 400%:
Image image = ImageIO.read(new File("~/yosemite1.jpg"));
ZoomableImagePanel panel = new ZoomableImagePanel(image);
Getters and setters give you access to the zoom controls: minimum and maximum zoom level, zoom factor and current zoom level. The panel provides by default a support for the mouse wheel but you might want to disable it in certain cases (for instance, if you want the mouse wheel to scroll the enclosing scroll pane instead of zooming in and out):
panel.setMouseWheelSupportEnabled(false);
Finally you can change the displayed image at anytime:
panel.setImage(newImageInstance);
Do not forget that, as a panel, this component can embed children. The demo does not use this ability but puts the zoomable panel within a drop shadow panel, which in turn sits on top of a checkboard panel thanks to the stack layout.
Bookmark blog post: del.icio.us Digg DZone Furl Reddit
Comments
Comments are listed in date ascending order (oldest first) | Post Comment
-
Wouldn't this rather belong in SwingX, as a subclass of JXImagePanel?
Posted by: sumitkishore on September 03, 2005 at 04:54 PM
-
It's not that fast for big images. Do you use getScaledInstance() with SCALE_SMOOTH? If, what about using SCALE_SMOOTH for small images and SCALE_FAST first with a redraw with SCALE_SMOOTH for better quality?
Posted by: ullenboom on September 04, 2005 at 10:33 AM
-
I'm not using getScaledInstance() because it's way slower than Graphics.drawImage() as it is not hardware accelerated. This version of the panel does not try to be clever about the clipping rectangle. It would be better to scale th eonly part belonging to the clipping rectangle, etc.
Posted by: gfx on September 04, 2005 at 03:08 PM
-
On my setup [windows xp jre 5.0 and 1.8 GHz primitie graphics s3 not ati or nvidia] turning the drop shadow on an doff had a big effect on the smoothness of the zooming...
Posted by: garythompson on September 05, 2005 at 01:02 PM
-
Couldn'r run the application in jdk 1.5
Posted by: mattias_xdin on September 06, 2005 at 08:40 AM
-
The idea is so nice, though the performance is so crappy...
Posted by: pholthuizen on September 06, 2005 at 09:57 AM
-
I didn't look into the implementation but I suppose that Romain uses Graphics2D.drawImage() passing along an AffineTransform. This allows to draw the image with the right offset and zooming factor with just one API call. This makes the code very clear and simple, and this gives complete control to the underlying implementation about what optimizations to use. That probably includes (or should!) the clipping rectangle trick calculation or delegate it to the lower layer (DirectDraw/Direct3D - OpenGL).
Of course, the drop shadow slows the all stuff down for 2 reasons : it is not hardware accelerated (on a reasonably fast system that should take about 10ms to compute), and since it accesses directly the pixels of the image, that image is not stored in VRAM (at least, that's what I understand from the JDK sources).
Posted by: spetrucci on September 06, 2005 at 11:34 AM
-
Just turn off the drop shadow to make it faster. As I said, the resizing could be smarted, but without the drop shadow it performs ok on most images. This is not meant to display 8 Mpixels pictures (well you get the point :) because in this case, special optimization are required.
Posted by: gfx on September 06, 2005 at 02:18 PM
-
Doesn't run for me 1.5 or 1.6
Posted by: applebanana8 on September 14, 2005 at 04:42 PM
-
Here's what I get when I try to run this:
com.sun.deploy.net.FailedDownloadException: Unable to load resource: http://www.progx.org/users/Gfx/apps/fx-zoomableimage-demo.jnlp
at com.sun.deploy.net.DownloadEngine.actionDownload(Unknown Source)
...
java.net.UnknownHostException: www.progx.org
at java.net.PlainSocketImpl.connect(Unknown Source)
at java.net.Socket.connect(Unknown Source)
...
Posted by: applebanana8 on September 14, 2005 at 04:45 PM
-
I am not able to run it on my system as i am using JDK6.0 ,can you give a brief idea ,to create a zoomable JComponent with mousewheel
Posted by: rani8vish on January 08, 2007 at 08:41 PM
-
I have not obtained to run the demo because the jar file is corrupted. I'd like to run that demo so much! Could you to correct it for us? Thank you and forgive me by my English's erros, I'm Brazilian and I'm learning English language. I hope somebody understand me.
Posted by: joymarinhu on March 29, 2007 at 08:09 AM
-
iam not able to run it ....iam using eclipse...while iam trying for running this it saying unable to launch,corrupted file. please give me a replay
Posted by: midulaj on October 29, 2007 at 10:10 PM
|