Blown Away (Swing Demo)

You can run the WebStart demo or, as usual, download its source code.

Before going any further, note this is not the promised demo I was talking about a few days ago. I swear this one is almost ready ^^

Adobe Photoshop provides an excellent feature I couldn't live without, at least on my 1024×768 laptops (I really long my screens I left home in France :). Whenever you press the Tab key Photoshop hides all the palettes hiding the picture you are working on. As you can drive the application with the keyboard without ever using the Tab key, this binding works perfectly. Blown Away is a Swing implementation of this feature with extra eye candy borrowed from MacOS X Exposé.

To make it look more realistic I just grabbed some screenshots of Photoshop and reused them in a simple Swing UI:

When you press the Tab key, all the palettes start moving away. As soon as you release Tab, they come back to their original location. You can press/release the key at anytime and control the animation as you wish. If you keep the Tab key pressed for about 500ms you'll end up with no palette on the screen. If you do have a dual screen setup, you'll see some palettes on the second screen though.

The back and forth animations are in the methods blowPalettesAway() and bringPalettesBack() of BlownAwayDemo. The code is a bit long and could be written in a much better manner (a lot of things are commong to both methods) but I don't really care for now :)

To create the effect, the code will basically compute the equation of the line between the center of the screen and the current location of a given window. Then, we find the horizontal distance between the original location and the location at which the window will be hidden. For instance, if the window moves toward the left edge of the screen, the horizontal distance will be origin.x + window.width. There are several cases to care of, each depending on how the window will get out of the screen.

When the animation timer ticks, the code computes the x position of the window along the line. This position is time-based. We can finally compute the y position of the window given the new x and move the window to the new location. And it works really well…

…Except with JDKs prior to Mustang. We unfortunately suffer from the infamous gray rect bug. When palette windows are animated over the main window, you can see flickering occuring. This is because every time we move a window a bit, the gray rect but appears:

A few months ago, Sun's teams introduced a fix for this hated bug. As a result, Blown Away works perfectly on Mustang (Java SE 6 or Java 1.6 as you wish). On this last screenshot you cannot see any gray area. I also added some motion blur on two palettes to show the windows are supposed to be moving.

With a bit of native code you can swap the blown away effect with a simple fade in/out. We used that trick for JavaOne and it required only a few lines of code for Windows and a bit more for X11 but nothing serious. You can also play on sizes by simply shrinking and growing the windows. Finally, if you are using internal frames, you can do pretty much anything you want like warping, rotations, etc.

2 Responses to “Blown Away (Swing Demo)”

  1. Tristan Seifert says:

    The download source doesn’t work, I just get a big, fat error 404

  2. Just wanted to say I really like your site and will definitely be back!