Flex title window dragger?

1

[AS]
<?xml version=“1.0” encoding=“utf-8”?>
<mx:Application xmlns:mx=“http://www.adobe.com/2006/mxml” layout=“absolute” themeColor=“haloGreen”>
<mx:Script>
<![CDATA[

        private function initTW():void {
            setTWEvents();
        }            
        private function setTWEvents():void {
            bg_tw.addEventListener(MouseEvent.MOUSE_DOWN, drag);
            bg_tw.addEventListener(MouseEvent.MOUSE_UP, drag);
        }
        private function drag(info:MouseEvent):void {
            if (info.type == "mouseDown") {
                bg_tw.startDrag();
            } else {
                bg_tw.stopDrag();
            }
        }
        
    ]]&gt;
&lt;/mx:Script&gt;
&lt;mx:TitleWindow id="bg_tw" width="500" height="400" layout="absolute" showCloseButton="true" title="Background Settings" x="76" y="10" creationComplete="{initTW()}"&gt;
    &lt;mx:Accordion includeInLayout="true" right="0" left="0" top="0" bottom="40"&gt;
        &lt;mx:VBox label="background image" width="100%" paddingLeft="10" paddingTop="10"&gt;
            &lt;mx:Tree /&gt;
        &lt;/mx:VBox&gt;
        &lt;mx:VBox label="background image position" width="100%" paddingLeft="10" paddingTop="10"&gt;
            &lt;mx:RadioButtonGroup id="backgroundImagePosition_rbg" /&gt;
            &lt;mx:RadioButton groupName="backgroundImagePosition_rbg" id="rb1" value="Center" label="Center" name="Center"/&gt;
            &lt;mx:RadioButton groupName="backgroundImagePosition_rbg" id="rb2" value="Center" label="Tile"/&gt;
            &lt;mx:RadioButton groupName="backgroundImagePosition_rbg" id="rb3" value="Center" label="Fill"/&gt;
            &lt;mx:RadioButton groupName="backgroundImagePosition_rbg" id="rb4" value="Center" label="Stretch"/&gt;
        &lt;/mx:VBox&gt;
        &lt;mx:VBox label="background color" width="100%" paddingLeft="10" paddingTop="10"&gt;
            &lt;mx:ColorPicker /&gt;
        &lt;/mx:VBox&gt;
    &lt;/mx:Accordion&gt;
    &lt;mx:HBox paddingBottom="10" paddingRight="10" horizontalAlign="right" right="0" bottom="0"&gt;
        &lt;mx:Button label="OK" id="bg_OK" /&gt;
        &lt;mx:Button label="CANCEL" id="bg_CANCEL" /&gt;
    &lt;/mx:HBox&gt;
&lt;/mx:TitleWindow&gt;

</mx:Application>
[/AS]

I want to drag only when I click on the window titlebar. It drag me all TW, what have to change to accomplish that?

2

I also ran into this problem ( a bit late but here is a solution ) :

Create a Flex Component (MyTitleWindow) and add this :

[AS]<?xml version=“1.0” encoding=“utf-8”?>
<mx:TitleWindow xmlns:mx=“http://www.adobe.com/2006/mxml” layout=“absolute” creationComplete="{init()}">

&lt;mx:Script&gt;
	&lt;![CDATA[
		
		private function init():void
		{
			this.titleBar.addEventListener( MouseEvent.MOUSE_DOWN, moveWindow );
		}
		
		private function moveWindow( evt:MouseEvent ):void
		{
			// if in AIR - else do startDrag() and add an evenListener for MOUSE_UP with stopDrag()
			stage.nativeWindow.startMove();
		}

	]]&gt;
&lt;/mx:Script&gt;

</mx:TitleWindow>[/AS]