« Indy Flex User Group Tomorrow! | Main | Indy Flex User Group Tonight! »
Simple Drag and Drop AIR
| By Rich Tretola | June 18, 2007 |  Print This Post
|
 (1 votes, average: 5 out of 5) Loading ... | 467 views |
Drag and Drop from the desktop to an AIR application is one of the new features of AIR.
Basically, I add the event listeners to the application to handle the drag events. Then when a file is dropped onto the application, I check the file extension and then handle it if is an image file or throw an alert if not. You can certainly update the switch statement to handle additional file extensions differently.
Here is some sample code:
- <?xml version="1.0" encoding="utf-8"?>
- <mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml"
- layout="vertical"
- creationComplete="init()">
- <mx:Script>
- <![CDATA[
- import flash.desktop.DragActions;
- import mx.controls.Alert;
- import mx.controls.Image;
- import flash.filesystem.File;
- import flash.desktop.TransferableData;
- import flash.desktop.TransferableFormats;
- import flash.events.NativeDragEvent;
- import flash.desktop.DragManager;
- private function init():void{
- this.addEventListener(NativeDragEvent.NATIVE_DRAG_ENTER,onDragIn);
- this.addEventListener(NativeDragEvent.NATIVE_DRAG_DROP,onDrop);
- this.addEventListener(NativeDragEvent.NATIVE_DRAG_EXIT,onDragExit);
- }
- public function onDragIn(event:NativeDragEvent):void{
- DragManager.acceptDragDrop(this);
- }
- public function onDrop(event:NativeDragEvent):void{
- DragManager.dropAction = DragActions.COPY;
- var dropfiles:Array = event.transferable.dataForFormat(TransferableFormats.FILE_LIST_FORMAT) as Array;
- for each (var file:File in dropfiles){
- switch (file.extension){
- case "png" :
- addImage(file.nativePath);
- break;
- case "jpg" :
- addImage(file.nativePath);
- break;
- case "gif" :
- addImage(file.nativePath);
- break;
- default:
- Alert.show("Unmapped Extension");
- }
- }
- }
- public function onDragExit(event:NativeDragEvent):void{
- trace("Drag exit event.");
- }
- private function addImage(nativePath:String):void{
- var i:Image = new Image();
- if(Capabilities.os.search("Mac") >= 0){
- i.source = "file://" + nativePath;
- } else {
- i.source = nativePath;
- }
- this.addChild(i);
- }
- ]]>
- </mx:Script>
- </mx:WindowedApplication>
Topics: Adobe AIR, Tutorials |
July 24th, 2007 at 5:50 pm
Great!
Thanks for this!
This is the key to one of the new apps I’m building. Thanks again!
August 2nd, 2007 at 3:35 pm
I downloaded Flex3 SDK.
am getting this error when i try to complie the mxml.
C:>mxmlc dnd.mxml
Loading configuration file C:FlexSDK3.0frameworksflex-config.xml
This beta will expire on Wed Oct 31 00:00:00 EDT 2007.
C:dnd.mxml(22): Error: Type was not found or was not a compile-time constant:
NativeDragEvent.
public function onDragIn(event:NativeDragEvent):void{
C:dnd.mxml(26): Error: Type was not found or was not a compile-time constant:
NativeDragEvent.
public function onDrop(event:NativeDragEvent):void{
C:dnd.mxml(46): Error: Type was not found or was not a compile-time constant:
NativeDragEvent.
public function onDragExit(event:NativeDragEvent):void{
Am i missing any files?
August 11th, 2007 at 1:51 pm
Except for the specified formats add “swf”.
September 2nd, 2007 at 7:45 am
Why this concept doesn’t work with Flash Based AIR application? I tried to implement this functionality in Flash CS3 AIR application and I used Loader instead of Image to add the image to the display list, but it fails even in the first step i.e. accepting the file. So it doesn’t accept the file, but it shows the lock icon and hence fails in the firs step.
September 25th, 2007 at 1:19 am
to umer
because you stage no have intergate object.
eg. add sprite
October 4th, 2007 at 12:56 pm
DragManager.dropAction = DragActions.COPY;
var dropFiles:Array = event.clipboard.dataForFormat( ClipboardFormats.FILE_LIST_FORMAT ) as Array;
for each (var file:File in dropFiles)
{
trace(”Adding file with extension [" + file.extension + "]“);
}
October 8th, 2007 at 11:09 pm
I get errors with Flex Builder 3 beta:
1119: Access of possibly undefined property transferable through a reference with static type flash.events:NativeDragEvent. Gallery_Manager/src dragTest.mxml line 28 1191899201962 15
1120: Access of undefined property TransferableFormats. Gallery_Manager/src dragTest.mxml line 28 1191899201963 16
October 8th, 2007 at 11:27 pm
AIR beta 2 has some changes that cause the errors.
October 9th, 2007 at 11:35 am
Uninstalled, and then installed AIR 1. Still getting same error in Flex. Some additional library I need to install?
October 21st, 2007 at 8:57 am
I had the exact same errors described above. I am also using Flex Builder 3 beta.
1119: Access of possibly undefined property transferable through a reference with static type flash.events:NativeDragEvent. line 28 1192971019734 137
1120: Access of undefined property TransferableFormats. line 28 1192971019734 138
Any clue what I can do?
October 22nd, 2007 at 12:33 pm
This was built on AIR beta 1, beta 2 changed the names of some of the classes.
December 8th, 2007 at 6:44 pm
I’ll be the first to celebrate if you ever make the tweaks to make this work with beta 2 and post it here
December 9th, 2007 at 8:34 am
Yes, I have a beta 2 example but it doesn’t work with beta 3 so I will just post the beta 3 version after the public release. Stay tuned.
February 22nd, 2008 at 2:20 pm
Erm, so where is the beta 3 example? This function is the core of my air app. So I need it to work. =( Would appreciate it if you could post an update please.
February 22nd, 2008 at 3:44 pm
It will be up next week along with a whole bunch of new AIR tutorials, and components.