flex day 5 air的drag和drop

air里面的drag和drop和web里面的应用不太相同。看了一下，其实相当于去读取剪切板。

首先，需要创建一个clipborad的对象，通过剪切板传输数据和对象，包含了几个标准的格式，

BITMAP_FORMAT：一个 BitmapData 对象（仅限 AIR）
FILE_LIST_FORMAT：File 对象的数组（仅限 AIR）
HTML_FORMAT：HTML 格式的字符串数据
TEXT_FORMAT：字符串数据
RICH_TEXT_FORMAT：包含 RTF 格式数据的 ByteArray
URL_FORMAT：URL 字符串（仅限 AIR）

主要使用的方法涉及到了getData(),setData(),hasFormat,分别对应获取，设置，检查clipboard对象信息。

<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" styleName="plain"
width="100%" height="100%"
>
<fx:Script>
<![CDATA[
import mx.controls.Alert;
import mx.core.IUIComponent;
import mx.managers.DragManager;
]]>
</fx:Script>
<fx:Declarations>
<!-- 将非可视元素（例如服务、值对象）放在此处 -->
</fx:Declarations>
<s:nativeDragEnter>
<![CDATA[
if (event.clipboard.hasFormat(ClipboardFormats.FILE_LIST_FORMAT)){
var files:Array = event.clipboard.getData(ClipboardFormats.FILE_LIST_FORMAT) as Array;
if (files.length == 1){
DragManager.acceptDragDrop(event.currentTarget as IUIComponent);
//setStyle("backgroundColor", 0xccccff);
}
}
]]>
</s:nativeDragEnter>
<s:nativeDragExit>
<![CDATA[

]]>
</s:nativeDragExit>
<s:nativeDragDrop>
<![CDATA[
var arr:Array = event.clipboard.getData(ClipboardFormats.FILE_LIST_FORMAT) as Array;
startImage.source = (arr[0] as File).url;
var j:String = (arr[0] as File).url;
trace(j.split(".")[1]);
if(j.split(".")[1] == "txt"){
var currentFile:File = arr[0];
var fs:FileStream = new FileStream();
fs.open(arr[0],FileMode.READ);
startTA.text = fs.readMultiByte(fs.bytesAvailable,File.systemCharset);
fs.close();
trace(startTA.text);
}
]]>
</s:nativeDragDrop>
<s:nativeDragOver>
<![CDATA[

//var i:int = Math.floor(Math.random()*10);
//var j:String = "0x"+i+"000cc";
var i:int = event.stageX;
var j:int = event.stageY;
setStyle("backgroundColor",i*j);

]]>
</s:nativeDragOver>
<mx:ViewStack id="startVS" width="100%" height="100%" creationPolicy="all">
<mx:Canvas width="100%" height="100%">
<mx:Text verticalCenter="0" horizontalCenter="0" color="white">
<mx:htmlText><![CDATA[<font size="20"><b>Drag an image here</b></font>]]></mx:htmlText>
</mx:Text>
<s:TextArea id="startTA" width="200" height="200"/>
<mx:Image id="startImage" width="100%" height="100%" horizontalAlign="center" verticalAlign="middle"/>
</mx:Canvas>
</mx:ViewStack>

</s:WindowedApplication>

先看了例子。这里还用到了几个事件，分别是nativeDragEnter,nativeDragOver,nativeDragDrop,nativeDragExit

主要是对air程序监听到了拖放信息的时候触发，当处于不同事件的时候做不同的事情。

尝试了用Math.Radom()，去设置background的背景色。

clipboard最终是一个Object File对象。

这里还用到了String的split()方法，去获取文件的后缀名。把txt文件内容放到TextArea里面。

所以拖拽的本质还是在操作  系统的剪切板，只是换了交互方式