Drag and move an Image from one Canvas to another Canvas
<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="horizontal">
<mx:Script>
import mx.managers.DragManager;
import mx.core.DragSource;
import mx.events.DragEvent;
import flash.events.MouseEvent;
[Embed(source='logo.jpg')]
public var globeImage:Class;
private function mouseOverHandler(event:MouseEvent):void
{
var dragInitiator:Image=Image(event.currentTarget);
var ds:DragSource = new DragSource();
ds.addData(dragInitiator, "img");
var imageProxy:Image = new Image();
imageProxy.source = globeImage;
imageProxy.height=10;
imageProxy.width=10;
DragManager.doDrag(dragInitiator, ds, event,imageProxy, -15, -15, 1.00);
}
private function dragEnterHandler(event:DragEvent):void {
if (event.dragSource.hasFormat("img"))
DragManager.acceptDragDrop(Canvas(event.currentTarget));
}
private function dragOverHandler(event:DragEvent):void
{
if (event.dragSource.hasFormat("img")) {
DragManager.showFeedback(DragManager.MOVE);
}else{
DragManager.showFeedback(DragManager.NONE);
}
}
private function dragDropHandler(event:DragEvent):void {
if (event.dragSource.hasFormat("img")) {
var draggedImage:Image = event.dragSource.dataForFormat('img') as Image;
var dropCanvas:Canvas = event.currentTarget as Canvas;
var newImage:Image=new Image();
newImage.source = draggedImage.source;
newImage.x = dropCanvas.mouseX;
newImage.y = dropCanvas.mouseY;
dropCanvas.addChild(newImage);
}
}
private function dragCompleteHandler(event:DragEvent):void {
var draggedImage:Image =event.dragInitiator as Image;
var dragInitCanvas:Canvas =event.dragInitiator.parent as Canvas;
if (event.action == DragManager.MOVE)
dragInitCanvas.removeChild(draggedImage);
}
</mx:Script>
<mx:Canvas width="50" height="50" backgroundColor="#0000FF">
<mx:Image id="myimg" source="@Embed(source='logo.jpg')" mouseMove="mouseOverHandler(event);" dragComplete="dragCompleteHandler(event);"/>
</mx:Canvas>
<mx:Canvas width="50" height="50"
backgroundColor="#0000FF"
dragEnter="dragEnterHandler(event);"
dragOver="dragOverHandler(event);"
dragDrop="dragDropHandler(event);">
</mx:Canvas>
</mx:Application>
Related examples in the same category
