Flex 侧边停靠控件

下图是 Microsoft Visual Studio IDE 的部分截图。
　　
　　这是一种可停靠的窗口，窗口标题栏第二个按钮可以控制窗口是否停靠。窗口处于停靠状态时就会与主界面融为一体，可以通过点击窗口下方（如果可停靠窗口处于整体布局下方的话）的TabBar来选择显示哪一个窗口；而非停靠状态的窗口则不会占据整体布局的空间，仅作为弹出窗口出现，TabBar只占据整体布局边侧的一小条空间，此时鼠标移向TabBar上的一个Tab则对应的窗口就会弹出，移开鼠标窗口也随之隐藏。这种侧边可停靠窗口是非常友善的用户界面，用Flex做前端界面时我们希望也能用上它。然而Flex并没有提供类似的组件，没关系，我们可以自己动手实现这种停靠窗口。
　　粗看之下，似乎用TabNavigator组件就可实现类似的效果，不过TabNavigator组件的TabBar好像只能在上方。而这种停靠窗口需要在上、下、左、右四个方向停靠，因此TabBar也需要能分别出现在各个方向，所以需要用一个容器嵌套ViewStack（里面嵌套可停靠窗口DockablePanel）及TabBar来实现。然而TabBar也不能完全符合要求，首先TabBar中的文本方向不能控制，其次每个Tab需要有两种状态，即由鼠点击控制选中/非选中以及鼠标移进自动选中移出则变为未选中。因此我们需要自己实现一个TabBar或者说是DockBar。
　　停靠窗口的停靠/非停靠状态的控制也有点棘手。如果是绝对布局，那么很好办，只要控制窗口的位置就可以了。但对于非绝对布局来说简单地改变位置就行不通了。不过倒是可以借助PopUpManager的addPopUp与removePopUp方法：当窗口处于停靠状态时，就把它放进ViewStack里，处于非停靠状态时就把它从ViewStack移中，并将其添加为弹出窗口。且记停靠窗口从ViewStack中移出或用PopUpManager的removePopUp移除后一定要设置它的includeInLayout属性为false，否则就达不到预想的效果。
　　停靠窗口（DockablePanel）的标题栏上还需要加一个停靠按钮，继承Panel后要创建这样一个按钮并把它加入到Panel的titleBar里。
　　侧边停靠窗口的实现大体就是这样的。我试着写了一下，基本实现了大部分的功能，不过代码比较滥，BUG也不少。
　　下图是我的Demo：
　　
　　程序下载：
http://download.csdn.net/source/2028447