Categories
Archives
- October 2008
- September 2008
- August 2008
- July 2008
- June 2008
- May 2008
- April 2008
- March 2008
- February 2008
- January 2008
- December 2007
- November 2007
- October 2007
- September 2007
- August 2007
- July 2007
- June 2007
- April 2007
- March 2007
- February 2007
- January 2007
- November 2006
- October 2006
- September 2006
- August 2006
- July 2006
- June 2006
- May 2006
String Concatenation vs. StringBuilder | Home | Avoiding Repetitious Code in JQuery
Filed under Lab on March 17, 2008 by Richard ZiadeEliminate Interface Clutter With Arc90 Lab's Collapsible Panel! (As Seen On TV)
I'm one of those people that goes to great lengths to keep my visible workspace clean and uncluttered...at any cost. I revel in the clean, straight lines around my desk. Open up one of my drawers and it's a whole other story, though. Out of sight, out of mind. Yes, it borders on anal-retentive hypocrisy, but still.
It's not a whole lot different for user interfaces. Sometimes, an easy and familiar way to "put away" interface clutter is to give users the ability to "hide away" parts of the interface. The Flex interface library is really great. It has just about everything you need to build rich, slick interfaces...except a drawer to put all my junk in.
Our own Andy Lewisohn has changed all that. Today on the Lab, we're releasing a collapsible panel custom component for Flex. It's simple to implement and nicely fits into the existing Flex UI framework.
So get on over there and grab it...and start hiding that clutter!
Trackback Pings (TrackBack URL for this entry)
http://www.arc90.com/cgi-bin/mt4/mt-tb.cgi/119.
Comments
@PaulH
Thanks. Taking your comments in order.
- removed the offending "1" from the MXML example.
- Compiled against 3.0.0 SDK, you could of course compile the course code against the 2.0.1 SDK with some minor modifications, mostly having to do with setting default styles.
- I added the assets.swf to the zip file.
Let me know if you come across any other issues.
Posted on March 19, 2008 11:02 AM by andyl
thanks, i was able to compile against 2.01 (after chopping away at the Style bits) but the collapse icon's not showing up, though it still works if you manage to hit the right spot on the panel. i guess i chopped away a bit too much.
any suggestions?
thanks.
ps: i'd just use flex 3 but we have one external component (w/out source) that won't run on flex 3 yet.
Posted on March 19, 2008 2:37 PM by PaulH
If you look in the new zip folder, there should be an assets.swf at src/assets. That file contains the icons and should be present when you compile. Also, since you removed the default style settings, you'll need to apply the icons via a style sheet.
CollapsiblePanel
{
collapseButtonUpSkin: Embed(source='/assets/assets.swf', symbol='CollapseButtonUp');
collapseButtonDownSkin: Embed(source='/assets/assets.swf', symbol='CollapseButtonDown');
collapseButtonOverSkin: Embed(source='/assets/assets.swf', symbol='CollapseButtonOver');
collapseButtonDisabledSkin: Embed(source='/assets/assets.swf', symbol='CollapseButtonDisabled');
}
Posted on March 19, 2008 4:43 PM by andyl
Hello arc90 personal:
I have a question. If CollapsiblePanel have height to 100% not work correctly, the component have the same value.
thanks!!
Posted on March 25, 2008 6:27 AM by nando
Awesome! Now we just need the triangle to rotate when it opens and closes. I hear that may be coming soon...
Posted on March 26, 2008 4:21 PM by Avi Flax
How would one go about changing the collapse from vertical to horizontal?
Posted on March 31, 2008 8:54 PM by Steve
Copied .swc file into libs directory and have added the component to my app as such
I cannot view the component in Design view, however I can view in the source and will work when compiled and run. Any ideas?
Dave
Posted on June 18, 2008 5:54 PM by David Meissner
Sorry. XML stripped. Try again...
<ns1:CollapsiblePanel height="200" width="200" x="10" y="10">
</ns1:CollapsiblePanel>
Posted on June 18, 2008 5:58 PM by David Meissner
Is there anyway to change the skin when the panel is collapsed or stop it from shrinking the skin when it collapses?
Posted on June 21, 2008 5:39 AM by ReeceX
Great component. Been using it for weeks without problems. Found one that is giving me fits. I get a very noticeable "pop" on the background (like the background color changes white/blue) when I use the Collapsible Panel in a new TitleWindow I use via the PopUpManager. This ONLY happens the first time the dialog is pop-upped.
Anyone encounter this? Using flex 3
Posted on July 16, 2008 4:57 PM by Shane
I like this component - it's easy to use and looks great. I'm trying to add objects (charts) to the panel dynamically, and the panel isn't resizing to show the charts. I'm creating the charts, calling panel.addChild(), and I've tried calling panel.invalidateDisplayList and panel.invalidateProperties and nothing is working. Any suggestions?
Posted on August 5, 2008 7:25 PM by lingie
This component is great.
just one question, can make the component start in minimized position. When I create it with the parameter collapsed="true" the first thing it does when I open it is minimize, so at the beginning everything is maximized.
Posted on October 9, 2008 8:59 PM by Ragnar
String Concatenation vs. StringBuilder | Main | Avoiding Repetitious Code in JQuery

looks like a pretty cool & easy to use component. a couple-three of things though:
- shouldn't the mml example be "containers:CollapsiblePanel" (missing "l")
- what SDK did you compile the swc against? i can't load it in flex 2.
- the assets.swf seems to be missing from the zip file.
Posted on March 18, 2008 7:32 PM by PaulH