Non solo è possibile trascinare un file dal sistema all'applicazione, ma si può eseguire anche il procedimento inverso.
Ciò che potremmo definire meraviglioso di questo procedimento è la possibilità di trascinare il file anche in altre applicazioni: pensiamo ad un programma che consenta di cercare delle foto da un database e poi permetta di trascinare quella desiderata ad esempio all'interno di Photoshop. Tutto questo è fattibile con AIR e relativamente poco codice.
Vediamo allora come poter creare un sistema per trascinare una foto dall'applicazione AIR ad un programma esterno; in questo caso l'immagine da trascinare sarà presa dall'hard disk con un percorso fisso per semplificare l'esempio.
Le classi da importare per gestire le operazioni sono le medesime viste in precedenza; andiamo anche a creare un componente Image che conterrà la foto da trascinare al di fuori dell'applicazione, in questo modo:
<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Script>
<![CDATA[
import flash.desktop.DragManager;
import flash.desktop.TransferableData;
import flash.desktop.DragManager;
import flash.filesystem.File;
import flash.events.NativeDragEvent;
]]>
</mx:Script>
<mx:Image x="35" id="foto" y="38" width="204" height="155"
mouseDown="trascina(event)"
source="c:/CD Concorso/Gatti/Foto/Foto001.jpg" />
</mx:WindowedApplication>
Come possiamo vedere il componente Image
contiene la foto, sull'evento mouseDown
(ovvero al click sul componente) richiama la funzione trascina()
, la quale si occupa di preparare il trascinamento:
private function trascina(event:MouseEvent):void
{
// Creo una nuova immagine basandomi sul contenuto del componente Image
var bitmap:Bitmap = Bitmap(event.target.content);
// ricavo le informazioni sul file originale
var bitmapFile:File = new File(event.target.content.loaderInfo.url);
// richiami la funzione crea_oggetto
var transferObject:TransferableData = crea_oggetto(bitmap,bitmapFile);
// Avvio il drag impostando l'immagine da usare,
// i dati da copiare e la posizione dell'immagine da visualizzare
DragManager.doDrag(this, transferObject, bitmap.bitmapData, new Point((-mouseX+65), (-mouseY+90)));
}
Questa funzione crea l'immagine che sarà visualizzata quando l'utente clicca sul componente (si può usare una copia dell'immagine, come in questo caso, o magari un'icona che identifichi il trascinamento), ricava il file da copiare e da via al trascinamento.
All'interno della variabile transferObject
memorizziamo invece i dati restituiti dalla funzione crea_oggetto()
, il cui codice è:
public function crea_oggetto(image:Bitmap, sourceFile:File):TransferableData
{
var transfer:TransferableData = new TransferableData();
transfer.addData(image,"Bitmap",false);
transfer.addData(image.bitmapData,"bitmap",false);
transfer.addData(new Array(sourceFile),"file list",false);
return transfer;
}
Con questi comandi creiamo un nuovo oggetto TransferableData
e vi inseriamo i dati relativi al tipo di file che andiamo a copiare, tutti dati che verranno memorizzati nella variabile transferObject
che viene poi passata al metodo doDrag
, dove i parametri corrispondono rispettivamente al componente che avvia il trascinamento (in questo caso il componente Image), la sorgente da trascinare, l'immagine da mostrare durante il trascinamento, la posizione X ed Y dell'immagine da mostrare (in questo caso è stata settata vicino al puntatore del mouse).
Testando l'applicazione e cliccando sulla foto vedremo apparire l'originale in trasparenza a simboleggiare il trascinamento, come illustrato di seguito. Quando il mouse uscirà dall'area dell'applicazione la foto di trascinamento non sarà più visibile ma noteremo comunque l'icona di inserimento elemento nell'applicazione dove porteremo la foto (Photoshop, Dreamwaver, Word solo per citarne alcune) o nella cartella dove vorremo copiarla.
Conclusione
AIR permette una grandissima interazione con il drag & drop, sia dal sistema verso l'applicazione AIR, sia col percorso inverso; utilizzando AIR ed affidandosi eventualmente a classi esterne disponibili sul Web per l'encoding di immagini JPG o PNG potrebbe essere ad esempio relativamente semplice creare un editor di foto dove si possano inserire le immagini trascinandole dal sistema alla finestra dell'applicazione, quindi modificarla e poi esportarle con il procedimento inverso, trascinando la foto ritoccata dall'applicazione al desktop.