图片拖曳

最新推荐文章于 2024-11-24 14:36:35 发布

iteye_2610

最新推荐文章于 2024-11-24 14:36:35 发布

阅读量132

点赞数

文章标签： XML

本文介绍了一种使用 Flex 实现图像拖拽的方法。通过 mx.controls.Image 和 mx.managers.DragManager 类来完成图像从源位置到目标位置的拖拽操作，并详细解释了 mouseDownHandler、enterHandler 和 dropHandler 函数的作用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="init()">
<mx:Canvas x="29" y="145" width="661" height="362">
<mx:Canvas id="canvas_1" x="118" y="30" width="457" height="117" backgroundColor="#F0E6E6">
<mx:Image id="hair" x="150" y="32" source="../images/hair_1_0.gif"/>
</mx:Canvas>
<mx:Canvas id="canvas_2" x="118" y="175" width="457" height="185" borderColor="#B2BCC3" backgroundColor="#B1D6F6" horizontalScrollPolicy="off" verticalScrollPolicy="off">
</mx:Canvas>
</mx:Canvas>
<mx:Script>
<![CDATA[
import mx.controls.Image;
import mx.core.DragSource;
import mx.managers.DragManager;
import mx.events.DragEvent;
private var sp_1:Sprite;
private var sp_2:Sprite;
private var del_per:Number=0.3;
private var del_alpha:Number = 0.1;

internal function init():void {
hair.addEventListener(MouseEvent.MOUSE_DOWN,mouseDownHandler);
canvas_2.addEventListener(DragEvent.DRAG_ENTER,enterHandler);
canvas_2.addEventListener(DragEvent.DRAG_DROP,dropHandler);
}

/***============拖曳============****/
private function mouseDownHandler(e:MouseEvent):void {
var dragTarget:Image = Image(e.currentTarget);
var ds :DragSource = new DragSource();
var imgProxy:Image = new Image();
imgProxy.source = hair.source;

imgProxy.width = dragTarget.width*2;
imgProxy.height = dragTarget.height*2;
DragManager.doDrag(dragTarget,ds,e,imgProxy,1*dragTarget.width/2,1*dragTarget.height/2,0.8);
}

/**进入canvas**/
private function enterHandler(e:DragEvent):void {
DragManager.acceptDragDrop(Canvas(e.target));
}

/***在canvas上松开鼠标**/
private function dropHandler(e:DragEvent):void {
var canvas:Canvas = Canvas(e.target); //目标canvas
var newImage:Image = new Image();
var dragImg:Image = Image(e.dragInitiator);
newImage.source = dragImg.source; //拖曳的原始对象
canvas.addChild(newImage);
newImage.x = canvas.mouseX - dragImg.width/2;
newImage.y = canvas.mouseY-dragImg.height/2;
}

]]>
</mx:Script>
</mx:Application>