The new Spark components included in Flex 4 are a tremendous step forward in terms of ease of skinning and extensibility, but some of them seem a little barebones out of the box. In particular the Panel and TitleWindow components are lacking a number of features that I frequently wind up needing (and I'm guessing I'm not alone). I tackled something similar in Flex 3, when I created the BetterTitleWindow component, but I've had a few more ideas for features and I'm all about Flex 4 these days, so I thought I'd give it another go.
Here's a quick rundown of all the features I added:
- - ability to collapse/expand
- - optional collapse/expand indicator
- - title bar or indicator clickable
- - ability to display a close button (which dispatches a CloseEvent)
- - closeButtonSkin can be specified
- - titleBarContent property can be used to add components to the title bar
- - layout of titleBarContent can be manipulated through titleBarLayout property
- - title bar height settable through a style property
The most fun feature I added is the ability to make the component collapsible, so that it minimizes down to just the title bar and expand back up. This is a pretty cool capability to have, and I have some ideas about using this to create a full-fledged Accordion replacement.
Here's some mxml showing how to set up the title bar content and layout:
And here's a sample app that shows the new features. View source is enabled, and you can also download the source from our svn.10 Comments