« AS3 -- on the lack of private and protected constructors | Main | Openings on the Adobe Flex team »
April 10, 2006
New Flex component - Sliding Drawer v 0.5
I created a panel that slides into view when you mouse near the edge of the screen as part of a personal project. I'm distributing the sliding drawer under creative commons so that other people can use it.
To use the drawer component, just add the tag to your view:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:ui="sho.ui.*">
<ui:Drawer title="Left" dockSide="left">
< !-- drawer contents go here -- >
</ui:Drawer>
</mx:Application>
This results in a drawer that pulls out from the left edge of the screen like so:

NOTE: Requires Flash Player 8.5 beta 2.
[Demo - sliding Drawers]
[Source code]
- Programmatic instantiation of these drawers has not been tested. I have only used <Drawer> as a tag in MXML.
- Drawers shows up in Flex Builder's design view at (0,0), which can be misleading.
- There is something funky about depth management. For example, if you put a <CompletionInput> in a drawer, the hints show up underneath the drawer.
- Resizing of children doesn't seem to be happenning correctly. For now, either use fixed sized contents inside of drawers, or help me find the bug! :-)
- There appears to be a compiler bug that makes it impossible to use an MXML component that is based on <Drawer>. If you would like to make an MXML component for your drawer contents, base the component on a container (such as <Canvas>) and put your component inside a <Drawer> tag, as opposed to basing your component directly on a Drawer.
Posted by sho at April 10, 2006 10:36 AM