flex: Ability to drag+drop a movieclip

Question

In order to improve user experience we want the ability to have an animated movieclip of a turning wheel- and have the ability to drag and drop it anywhere on a defined area

We have built the rotating wheel as a swc file.

How do we do the drag+drop. Examples that I have seen, cater to only dropping of images. Thanks again

Answer 1

You should specify the dragProxy for the movieClip to hold an instance of it instead of a fixed image.

Answer 2

To use the Flex classes for drag and drop you'll need to wrap that movieClip in an a UIComponent ; which has all the events related to drag and drop.

Here are some good instructions . To copy the relevant pieces:

Make a Component Draggable

1. Add listener for MouseEvent.MOUSE_DOWN
2. Determine drag initiator and hand-off to DragManager

To kick off a drag-n-drop, you'll need a MouseEvent for the component to be dragged.

public function makeDraggable( component:IUIComponent ):void
{
   // a mouseDown event will start the drag
   component.addEventListener( MouseEvent.MOUSE_DOWN, beginDrag );
}

public function beginDrag( mouseEvent:MouseEvent ):void
{
   // the drag initiator is the object being dragged (target of the mouse event)
   var dragInitiator:IUIComponent = mouseEvent.currentTarget as IUIComponent;

   // the drag source contains data about what's being dragged
   var dragSource:DragSource = new DragSource();

   // ask the DragManger to begin the drag
   DragManager.doDrag( dragInitiator, dragSource, mouseEvent, null );
}