Flickr Floater: Building an Adobe AIR application with Flex 3

Adding drag-and-drop support

The flash.desktop package has the native drag manager (NativeDragManager) to handle the drag-and-drop interactivity. It also contains the new Clipboard object class to aid in the passage of objects into an application from either the operating system's clipboard or through a drag-and-drop action. The ClipboardFormats class is also used as a part of this process by defining the type of data used by the Clipboard class.

The sample code below has functions for the dragEnter and dragDrop events. You need to create a specific process in order for drag-and-drop support to work. The dragEnter event must call the acceptDragDrop method of the NativeDragManager and nominate that a DisplayObject can accept calls from the dragDrop event, otherwise the dragDrop event will not fire. This also allows the developer to control where the drop action can occur.

The onDragDrop function takes the files dragged out from the clipboard and processes them, checking the format of each file with a switch statement to test for the three image formats that Flickr Floater is going to accept. If the current file is acceptable, the addDroppedFile function is called and the file is copied to the images directory within the application's storage folder.

<mx:Script>
 <![CDATA[
   import flash.desktop.NativeDragManager;
   import flash.desktop.NativeDragActions;
   import flash.desktop.Clipboard;
   import flash.desktop.ClipboardFormats;
   import mx.controls.Alert;
   private var imagesDir:File =
  File.applicationStorageDirectory.resolvePath("images");
   private function onDragEnter(event:NativeDragEvent):void {
     NativeDragManager.acceptDragDrop(fileListing);
   }
   private function onDragDrop(event:NativeDragEvent):void {
     NativeDragManager.dropAction = NativeDragActions.COPY;
     var droppedFiles:Array =
  event.clipboard.getData(ClipboardFormats.FILE_LIST_FORMAT) as Array;
     for each (var file:File in droppedFiles) {
       switch (file.extension) {
         case "jpg":
           addDroppedFile(file.nativePath,file.name);
           break;
         case "gif":
           addDroppedFile(file.nativePath,file.name);
         default:
           Alert.show("Unsupported file type!");
       }
     }
   }
   private function
  addDroppedFile(nativePath:String,fileName:String):void {
     var original:File =
  File.userDirectory.resolvePath(nativePath);
     var newFile:File =
    File.applicationStorageDirectory.resolvePath(imagesDir + "/" +
  fileName);
     original.copyTo(newFile, true);
     fileListing.refresh();
   }
]]>
</mx:Script>
<mx:FileSystemList id="fileListing"/>

Page 4 of 9

Previous Page

Next Page