加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

flex中拖动时移动和复制图片

发布时间:2020-12-15 04:37:21 所属栏目:百科 来源:网络整理
导读:????? Flex 拖动图片的移动和复制其实是一样的,不一样的地方就是在图片拖拽到目标的时候的一个操作,移动是把拖拽的资源直接赋值给一个 image 对象,相对来说比较简单,就不多说;而复制则是把拖拽的资源中的一些数据取出来,放到一个新的 image 对象,本例

????? Flex 拖动图片的移动和复制其实是一样的,不一样的地方就是在图片拖拽到目标的时候的一个操作,移动是把拖拽的资源直接赋值给一个image对象,相对来说比较简单,就不多说;而复制则是把拖拽的资源中的一些数据取出来,放到一个新的image对象,本例子中是把拖拽资源的大小数据取出,然后根据拖拽资源的长宽创建一个大小一样的bitmapdata对象,把拖拽资源添加到bitmapdata数据中。

在本例中控制复制移动的语句在dragOverHandle方法中,用DragManager来设置拖拽事件中的复制移动情况,直接。拖动是移动,当按着ctrl键是复制。

<?xml version="1.0" encoding="utf-8"?>?

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">?

<mx:Script>?

?? <![CDATA[

?? import mx.controls.Alert;

?? import mx.containers.Canvas;

?? import mx.managers.DragManager;

?? import mx.core.DragSource;

?? import mx.controls.Image;

?? import mx.events.DragEvent;

?? [Embed(source="asset/che1.gif")]

?? [Bindable]

?? privatevar che:Class;

?? [Embed(source="asset/camera.gif")]

?? [Bindable]

?? privatevar camera:Class;

??? privatefunction mouSEOverHandle(e:MouseEvent):void{

????????? var dragImag:Image = e.currentTargetas Image;//启动拖动操作的图片

????????? var ds:DragSource =new DragSource();//拖拽资源

????????? ds.addData(dragImag,"img");

?????????

????????? var imagProxy:Image =new Image();//拖动过程中显示的拖动虚影

????????? imagProxy.source = che;

????????? imagProxy.height = 30;

????????? imagProxy.width = 30;

????????? DragManager.doDrag(dragImag,ds,e,imagProxy,-15,1,true);

??????? }

??????? privatefunction dragEnterHandle(e:DragEvent):void{

????????? if(e.dragSource.hasFormat("img")){

??????????? DragManager.acceptDragDrop(Canvas(e.currentTarget));

????????? }

??????? }

??????? privatefunction dragOverHandle(e:DragEvent):void{

????????? if(e.dragSource.hasFormat("img")){

????????? ??if(e.ctrlKey){

????????? ??????DragManager.showFeedback(DragManager.COPY);

????????????????? return ;

????????? ??}else{

????????? ??????DragManager.showFeedback(DragManager.MOVE);

????????? ??????return;

????????? ??}

?????????? }

?????????? DragManager.showFeedback(DragManager.NONE);

??????? }

??????? privatefunction dragDropHandle(e:DragEvent):void{

?????????? if(e.dragSource.hasFormat("img")){

?????????? ? ?var dragImag:Image = e.dragSource.dataForFormat("img")as Image;

?????????? ? ?var dropCanvas:Canvas = e.currentTargetas Canvas;

?????????? ? ?var newImag:Image =new Image();

?????????? ? ?if(e.action == DragManager.COPY){

?????????? ? ?? //复制图片

?????????? ? ???newImag.source =new Bitmap(getBitmapData(dragImagas DisplayObject));

?????????? ? ?}else{

?????????? ? ?? //移动图片

?????????? ? ???newImag.source = dragImag;

?????????? ? ?}

???????????? newImag.x = dropCanvas.mouseX;

???????????? newImag.y = dropCanvas.mouseY;

?????????? ? ?dropCanvas.addChild(newImag);

?????????? }

??????? }

?

???? /**

???? * 获取图片信息

???? * */

??? privatefunction getBitmapData(target:DisplayObject):BitmapData

??? {

??????? var res:BitmapData =new BitmapData(target.width,target.height);

??????? res.draw(target);

??????? return res;

??? }

?? ]]>?

</mx:Script>?

<mx:Panel title="不同类型非列表移动和复制图片" width="90%" height="90%">

?? <mx:HBox width="100%" height="100%">

????? <mx:Canvas height="200" width="200" borderStyle="solid" backgroundColor="0xFFF6D5">

??????? <mx:Image id="myimag" source="{che}" buttonMode="true"

??????? ?? mouseMove="mouSEOverHandle(event)"

??????? ? />

????? </mx:Canvas>

????? <mx:Canvas height="200" width="200" borderStyle="solid" backgroundColor="0xFEFEF1"

????? ?? dragDrop="dragDropHandle(event)"

????? ?? dragEnter="dragEnterHandle(event)"

????? ?? dragOver="dragOverHandle(event)"

????? ?? />

?? </mx:HBox>

</mx:Panel>?

</mx:Application>

?

总结:在这个例子中是以图片为例的,其他拖动操作和这个类似,并且根据不同的需求,可以在dragdrop事件处理函数中做不同的操作。

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读