Merge a VDivided Box & Accordian

Question

I have an application w/ 2 side-by-side pages of text. I have the VDivided box set up so the user can drag it to make one of the documents bigger or smaller.

Is there a way to get the look of a VDivided box & the functionality of an Accordian, so that when the user clicks the VDivided box (or double clicks, I haven't decided) one of the documents will be hidden? (For instance, double clicking on the right-most side of the divider will hide the left document, and vice-versa)

In addition, if the user wanted to drag the divider, then they can do that as well.

I don't have much, but here it is so far:

<mx:HBox width="100%" height="100%">
  <mx:HDividedBox width="100%" height="100%">

    <s:TextArea height="100%" width="50%" id="left" />
    <s:TextArea height="100%" width="50%" id="right" />

  </mx:HDividedBox>
</mx:HBox>  

Answer 1

Try changing the height of the vDividedbox, use also Resize effect to have a smooth resizing effect.

mx.effect.Resize