user interface - Creating a vertically draggable container in Adobe Flex 3.5 -

i attempting create container can drag bottom edge down increase height of container. cannot find container default or 1 apply functionality setting property (resizable="true").

the vdividedbox has dragging functionality similar looking for, however, can used drag divider located between 2 panels within preset height, cannot increase height of vdivivdedbox need happen.

i have found few examples use wrapper class wraps uicomponent implement dragability. however, trying avoid adding several different classes achieve effect.

the source code below uses mx:hbox contain , display text, however, willing use different container if allows me implement vertical dragability need.

if has solution, or link solution, greatful. ....

<?xml version="1.0" encoding="utf-8"?> <mx:windowedapplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"                     height="750" width="1080" xmlns:appcomponents="*"                     creationcomplete="windowedapplication1_creationcompletehandler(event)" textalign="center">  <mx:script>     <![cdata[         import flash.display.nativewindow;         import flash.display.sprite;         import flash.events.event;          import mx.events.flexevent;          var str1:string = "this shorter test string.";          var str:string = "\r\n  version 1.1.0.3 new version includes:\r\n  * added numerous new icons " +             "to support different file types in list screens.\r\n  * made changes allowing search " +             "index remain on server , not have download desktop.  save people " +             "having download search index, have connected server search.  " +             "on small projects not issue, larger projects should keep search index on " +             "server.  configurable project.\r\n  * added support adobe acrobat 11.\r\n  * added " +             "network version support – mysmartplans allow store files anyplace on hard " +             "drive or on network.  multiple people can point same place on network, eliminating " +             "redundant downloads.  users need connected network see information.  " +             "this computer independent, user’s desktop computer store files on server , " +             "their laptop store files locally.  new option appears under dropdown in mysmartplans." +             "\r\n  * added features pims can add links external documents in calendar , can email " +             "out .ics files admin screen , attach files emails go out.\r\n  * fixed problem " +             "with user profile , errors caching email , password information.\r\n  * added %username% support " +             "in open url include email addresses.  support auto logins.\r\n  * added support web " +             "pages link external reports local center browser option.\r\n  * added ability add " +             "links calendar events become clickable on desktop version.\r\n\r\nif wish " +             "be beta tester our mac version please email info@mysmartplans.com\r\n\r\n"          protected function windowedapplication1_creationcompletehandler(event:flexevent):void{             bannertext.text = str;             verticalexpand.end();             verticalexpand.play();             fadein.play();         }         protected function linkbutton_clickhandler(event:mouseevent):void{             verticalcontract.end();             verticalcontract.play();         }         protected function expandbutton_clickhandler(event:mouseevent):void{             verticalexpand.end();             verticalexpand.play();             fadein.play();         }         protected function closebanner_clickhandler(event:mouseevent):void{             verticalcontract.end();             verticalcontract.play();             fadeout.play();         }     ]]>  </mx:script>  <mx:resize id="verticalcontract" target="{banner}" heightto="0"/> <mx:resize id="verticalexpand" target="{banner}" heightfrom="0" heightto="162"/> <mx:fade id="fadeout" duration="600" target="{banner}" alphafrom="1.0" alphato="0.0"/> <mx:fade id="fadein" duration="1200" target="{banner}" alphafrom="0.0" alphato="1.0"/>  <mx:button id="expandbanner" label="expand" click="expandbutton_clickhandler(event)" />  <mx:hbox id="banner" width="61%" height="0" bordercolor="#000"           top="0" paddingleft="34" paddingtop="7" paddingbottom="7"          backgroundcolor="#faa7b0" horizontalcenter="0"          borderstyle="solid" filters="{[new dropshadowfilter(3,90,0x996666,.8,10,10,.98)]}"          verticalscrollpolicy="off" hideeffect="{fadeout}"          horizontalscrollpolicy="off"          verticalalign="middle">      <mx:hbox x="167" width="741" height="146" backgroundcolor="#faa7b0"              verticalscrollpolicy="auto" horizontalscrollpolicy="off">         <mx:text id="bannertext" width="725" fontsize="11"/>     </mx:hbox>      <mx:linkbutton label="close  x" id="linkbutton" themecolor="#faa7b0" textrollovercolor="#000"                    fontweight="normal" click="closebanner_clickhandler(event)"/> </mx:hbox>   </mx:windowedapplication>