Flex 自定义拖放

1.首先为父容器中的组件添加mousedown事件，并将其作为拖放的对象
var initiator:IUIComponent = event.currentTarget as IUIComponent; 
var dragSource:DragSource = new DragSource();
dragSource.addData(initiator, FORMAT);
DragManager.doDrag(initiator, dragSource, event);
2.父容器允许拖放
在dragEnterHandler事件中允许拖放
if(event.dragSource.hasFormat(FORMAT)){
   DragManager.acceptDragDrop(VGroup(event.currentTarget));
}
3.拖放完成进行处理
为容器添加dragDropHandler事件
通常要改变对象在容器中的叠放层次
所以接下来要看看Flex中改变对象在容器中的叠放层次的相关知识点

下面是一个简单的实例，中间有些定位方法要修改这里我就凑合用着

 

<?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/halo" minWidth="1024" minHeight="768" xmlns:ns1="*">
    
 <fx:Script>
  <![CDATA[
   import mx.events.FlexEvent;
   import mx.events.DragEvent;
   import mx.core.DragSource;
   import mx.core.IUIComponent;
   import mx.events.DragEvent;
   import mx.managers.DragManager;
   private static const FORMAT:String = "VGroup";
   protected function out_dragDropHandler(event:DragEvent):void
   {
      var dragElement:VGroup = event.dragInitiator as VGroup;
      out.removeElement(dragElement);
      var newindex:int=(mouseY-out.y)/dragElement.height;
      out.addElementAt(dragElement,newindex);
      debug(newindex.toString());
      debug("dsad");
   }
   protected function out_dragEnterHandler(event:DragEvent):void
   {
    if(event.dragSource.hasFormat(FORMAT))
    {
     DragManager.acceptDragDrop(VGroup(event.currentTarget));
    }
   }
   protected function in1_mouseDownHandler(event:MouseEvent):void
   { 
    var tag:Boolean=false;
    switch(event.currentTarget)
    {
     case in1: tag=(mouseX>out.x+in1.x+Btn1.width||mouseY>out.y+in1.y+Btn1.height);break;         
     case in2: tag=(mouseX>out.x+in2.x+Btn2.width||mouseY>out.y+in2.y+Btn2.height);break;        
     case in3: tag=(mouseX>out.x+in3.x+Btn3.width||mouseY>out.y+in3.y+Btn3.height);break;
     case in4: tag=(mouseX>out.x+in4.x+Btn4.width||mouseY>out.y+in4.y+Btn4.height);break;      
    }
    if(tag){
     var initiator:IUIComponent = event.currentTarget as IUIComponent;
     var dragSource:DragSource = new DragSource();
     dragSource.addData(initiator, FORMAT);
     DragManager.doDrag(initiator, dragSource, event);
    }
    
   }
   private function debug(msg:String):void
   {
    txt_msg.text+=msg;
   }
  ]]>
 </fx:Script>
 <s:TextArea id="txt_msg" x="518" y="128"/>
 <s:Panel>
  <s:VGroup x="11" y="19" width="350" id="out" dragDrop="out_dragDropHandler(event)" dragEnter="out_dragEnterHandler(event)" height="643">
   <s:VGroup width="143" height="100" id="in1" y="0" mouseDown="in1_mouseDownHandler(event)">
    <s:Button label="VGrop_in1" id="Btn1"/>
   </s:VGroup>
   <s:VGroup width="143" height="100" y="100" id="in2" mouseDown="in1_mouseDownHandler(event)">    
    <s:Button label="VGrop_in2" id="Btn2"/>
   </s:VGroup>
   <s:VGroup width="143" height="100" y="200" id="in3" mouseDown="in1_mouseDownHandler(event)">
    <s:Button label="VGrop_in3" id="Btn3"/>
   </s:VGroup>
   <s:VGroup width="143" height="100" y="300" id="in4" mouseDown="in1_mouseDownHandler(event)">

    <s:Button label="VGrop_in4" id="Btn4"/>
   </s:VGroup>
  </s:VGroup>
 </s:Panel>
 <s:layout>
  <s:BasicLayout/>
 </s:layout>
</s:Application>