The first part introduced the TransitionLayout. This layout is set "on top" of the existing layout manager (delegating all the regular work to it) and handles the changes in component visibility and bounds. The technical implementation will be discussed in the next parts (it is being actively worked on to provide a robust out-of-the-box support and can be accessed right here).

This part shows the transition layout manager applied to a "real-world" application that has been detailed in the series about SVG integration. The application shows thumbnails of all images in a selected folder and allows resizing them using a slider. While the usual version jumps from the old thumbnail size to the new thumbnail size, the new version makes the experience more interactive:

Note the following effects (with no changes to application code except setting the layout manager):

• The thumbnails are faded-in when they first appear.
• The thumbnails are moved and resized on changing the global thumbnail size. The original layout manager is responsible only for the final location
• During the move / resize, the thumbnails are part-time translucent to allow for smoother visual feedback.

Stay tuned for more (until the baby in the picture gets back next week from the overseas trip and the free time is over :)