23.10.使用本地拖拽(Drag-and-Drop)API

2024-04-27 13:52:33

字体：大中小

来源：转载

供稿：网友

23.10.1.问题
我想在应用程序内外拖动数据.
23.10.2.解决办法
添加数据到剪贴板，使用NativeDragManager类管理拖拽操作。
23.10.3.讨论
通过本地的drag-and-drop API文件系统和AIR应用程序之间可以进行数据传输。当一个拖拽姿势启动后，指定格式的数据被添加到剪贴板并传递给NativeDragManager的doDrag方法。

你可以注册事件监听器监听NativeDragManager类拖拽操作发出的completion事件。事件对象类型是NativeDragEvent类实例，通过NativeDragEvent.clipboard属性可访问剪贴板数据。

当用户用鼠标选择了应用程序的某一个元素，即一个拖拽姿势被启动。当用户按住鼠标，操作进入“拖阶段”，所有继承自flash.display.InteractiveObject类的注册组件都可接受拖拽动作。

当用户松开鼠标即表示拖拽姿势完成。启动拖拽姿势的组件被认为是“拖动源”，接受拽操作的InteractiveObject实例被认为是“拖拽目标”。

Flex Framework本身就支持应用程序内的拖拽操作，而本地的拖拽API运行在文件系统和AIR程序之间拖拽数据。我们推荐使用Flex FrameWork 拖拽API 。如果你熟悉mx.managers.DragManager 类在Flex 程序内传输数据的话，那么你会发现flash.desktop.NativeDragManager类与此非常相似。有个重要方面需要注意的是两个类的DragSource对象被添加到DragManager实例中，而Clipboard对象被添加到NativeDragManager实例中。

下面的例子使用NativeDragManager添加一个图片到剪贴板，并使用拖拽姿势传输数据到文件系统的一个目录：

-XML

<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical" windowComplete="initHandler();" closing="closeHandler();">
<mx:Script>
<![CDATA[
import mx.graphics.codec.PNGEncoder;
private var tempDir:File = File.createTempDirectory();
private var imageData:BitmapData;
private function initHandler():void {
imageData = new BitmapData( image.width, image.height );
imageData.draw( image );
}
private function closeHandler():void {
tempDir.deleteDirectory();
}
private function clickHandler():void {
var transfer:Clipboard = new Clipboard();
transfer.setData( ClipboardFormats.FILE_LIST_FORMAT, [getImageFile()], false);
NativeDragManager.dropAction = NativeDragActions.COPY;
NativeDragManager.doDrag(this ,transfer,imageData);
}
private function getImageFile():File {
var tempFile:File = tempDir.resolvePath( "img.png");
var png:ByteArray = new PNGEncoder().encode( imageData );
var stream:FileStream = new FileStream();
stream.open( tempFile, FileMode.WRITE );
stream.writeBytes( png );
stream.close();
return tempFile
}

]]>
</mx:Script>
<mx:Image id="image" source="@Embed(source='assets/bigshakey.png')"
buttonMode="true" useHandCursor="true" mouseDown="clickHandler();" />
</mx:WindowedApplication>