[flexcoders] Drag and Drop toolbox

[juvemihaido]

Well, in the toolbox the are labels for the components.I want to drag 
the label and drop the component.After that i want to double click the 
component to show an alert.

The Application:

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009";
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"
xmlns:components="components.*">
<fx:Declarations>
<s:ArrayList id="tool">
<s:Label name="label"/>
<s:TextInput name="textInput"/>
<s:BorderContainer name="Region"/>
</s:ArrayList>
</fx:Declarations>

<fx:Script>
<![CDATA[
import mx.controls.Alert;
import mx.core.IUIComponent;
import mx.events.DragEvent;
import mx.managers.DragManager;

import spark.components.BorderContainer;
import spark.components.Group;
protected function dragEnterHandler(event:DragEvent):void
{

DragManager.acceptDragDrop(event.currentTarget as IUIComponent);
}


protected function dragDropHandler(event:DragEvent):void
{
event.dragInitiator.x = event.currentTarget.mouseX -
event.dragInitiator.width/2;
event.dragInitiator.y = event.currentTarget.mouseY -
event.dragInitiator.height/2;
event.currentTarget.addElement(event.dragInitiator as IUIComponent);
}




protected function tool1_dragCompleteHandler(event:DragEvent):void
{
event.dragInitiator.addEventListener(MouseEvent.DOUBLE_CLICK, goa);
}

public function goa(event:MouseEvent):void
{
Alert.show("ok");
}

]]>


</fx:Script>




<components:Body x="106" width="955" height="400"
dragEnter="dragEnterHandler(event)"
dragDrop="dragDropHandler(event)" y="0"
doubleClickEnabled="true"  mouseEnabled="true"/>


<components:Tool x="800" y="400" dataProvider="{tool}"
dragComplete="tool1_dragCompleteHandler(event)" />
</s:Application>


and the Tool component:

<?xml version="1.0" encoding="utf-8"?>
<s:SkinnableDataContainer xmlns:fx="http://ns.adobe.com/mxml/2009";
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" width="100" height="100">
<s:layout>
<s:VerticalLayout/>
</s:layout>
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>

<fx:Script>
<![CDATA[
import flash.utils.flash_proxy;

import mx.core.DragSource;
import mx.core.IUIComponent;
import mx.managers.DragManager;
import mx.utils.object_proxy;

import spark.components.Label;
import spark.components.supportClasses.ItemRenderer;
public function mouseDownHandler(event:MouseEvent):void
{
//  var dragSrc:Object = event.currentTarget ;


// var className:String = getQualifiedClassName(dragSrc);
//var klass:Class = getDefinitionByName(className) as Class;
//var proxy:* = new klass();



DragManager.doDrag(event.currentTarget as IUIComponent,null,event);
}


]]>


</fx:Script>

<s:itemRenderer >
<fx:Component >
<s:ItemRenderer >


<s:HGroup >
<s:Label text="{data}"
mouseDown="outerDocument.mouseDownHandler(event)"/>

</s:HGroup>
</s:ItemRenderer>
</fx:Component>
</s:itemRenderer>

</s:SkinnableDataContainer>


It drops only the labels and the double click doesn't work.
any ideas?
Thank You