flex drag

mxml文件：

xml version="1.0" encoding="utf-8"?>
<control:Test5 xmlns:fx="http://ns.adobe.com/mxml/2009"
                  xmlns:s="library://ns.adobe.com/flex/spark"
                  xmlns:mx="library://ns.adobe.com/flex/mx" xmlns:components="components.*" xmlns:control="components.control.*">
    <fx:Declarations>

    fx:Declarations>
    <s:Panel id="a" x="57" y="46" width="250" height="200">
        <s:layout>
            <s:TileLayout/>
        s:layout>
        <s:Button label="2"/>
        <s:Button label="3"/>
        <s:Button label="4"/>
        <s:Button label="5"/>
        <s:Button label="6"/>
        <s:Button label="7"/>
        <s:Button label="8"/>
        <s:Button label="9"/>
        <s:Button label="1"/>
    s:Panel>
    <s:Panel id="b" x="352" y="46" width="250" height="200">
        <s:layout>
            <s:TileLayout/>
        s:layout>
    s:Panel>
control:Test5>

ac文件：

package components.control
{
    import flash.events.MouseEvent;

    import mx.core.DragSource;
    import mx.core.UIComponent;
    import mx.events.DragEvent;
    import mx.events.FlexEvent;
    import mx.managers.DragManager;
    import mx.preloaders.Preloader;

    import spark.components.Panel;
    import spark.components.Application;

    public class Test5 extends Application
    {
        public var a:Panel;
        public var b:Panel;

        public function Test5()
        {
            super();
            addEventListener(FlexEvent.CREATION_COMPLETE, creationCompleteHandler);
        }

        protected function creationCompleteHandler(event:FlexEvent):void
        {
            for(var i:int  = 0; i < a.numElements; i++)
            {
                a.getElementAt(i).addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
            }
            a.addEventListener(DragEvent.DRAG_ENTER, dragEnterHandler);
            a.addEventListener(DragEvent.DRAG_DROP, dragDropHandler);
            b.addEventListener(DragEvent.DRAG_ENTER, dragEnterHandler);
            b.addEventListener(DragEvent.DRAG_DROP, dragDropHandler);
        }

        private static function mouseDownHandler(event:MouseEvent):void
        {
            var dragInitiator:UIComponent = UIComponent(event.currentTarget);
            var ds:DragSource = new DragSource();
            ds.addData(dragInitiator, "myRule");
            DragManager.doDrag(dragInitiator, ds, event);
        }

        private static function dragEnterHandler(event:DragEvent):void
        {
            if (event.dragSource.hasFormat("myRule"))
            {
                DragManager.acceptDragDrop(UIComponent(event.currentTarget));
            }
        }

        private static function dragDropHandler(event:DragEvent):void
        {
            var dragObject:UIComponent = UIComponent(event.dragInitiator);
            Panel(event.currentTarget).addElement(dragObject);
        }
    }
}

flex里面主要通过

• DragManager：mx.managers 包中，管理拖拽事件
• DragSource：mx.core 包中，是Flex 框架的核心成员，处理拖拽中的数据传递
• DragEvent:：mx.events 包中，拖拽操作中的事件对象

来实现拖拽的功能。