Questo tutorial spiegherà come creare le proprie estensioni di file in Adobe AIR. Ti mostrerò come creare una piccola applicazione, salvare le posizioni di un paio di clip mobili al suo interno e ricaricarle all'avvio dell'applicazione.
Seguire e vedere se è possibile venire con i propri usi per le estensioni di file personalizzati ...
Apri un nuovo documento Flash Air, chiamalo "saveFile" e salvalo in una nuova cartella. Quindi, apri un nuovo file ActionScript, assegna lo stesso nome e salvalo nella stessa cartella del documento Flash appena creato.
Se la schermata del prompt non viene visualizzata all'avvio di Flash, è sufficiente creare un nuovo documento Flash ActionScript 3. Salva il file, quindi vai a Comandi> AIR - Impostazioni applicazione e programma di installazione. Flash convertirà il file in un documento Air.
Nel pannello delle proprietà del documento Flash, digita "saveFile" nel campo della classe Documento. Questo associerà il nuovo file ActionScript (la nostra classe di documento) con il documento Flash.
Crea un quadrato nero con un'altezza di 52, imposta la larghezza come larghezza dello stage e allinala alla parte inferiore sinistra dello stage. Dai al quadrato un alfa di 33. Nel pannello dei componenti, trascina tre pulsanti e posizionali sopra il quadrato nero.
Assegna a uno dei pulsanti il nome di un'istanza di "apri" e modifica l'etichetta per dire "Apri". Il prossimo pulsante avrà un nome di istanza di "salva" e la sua etichetta sarà "Salva". Il terzo nome dei pulsanti sarà "immagine" e avrà l'etichetta "Immagine". Distribuiscile come vuoi, seleziona tutti e tre i pulsanti e il quadrato nero e trasformali in un unico Movie Clip che ha il nome di un'istanza di "footer".
Sul palco, crea un cerchio rosso con un'altezza e una larghezza di 50 px. Convertilo in un Movie Clip, quindi nella finestra di dialogo, premi il pulsante "Avanzate". Sotto "Linkage" seleziona la casella "Esporta per ActionScript". Dagli un nome di classe di "Rosso" e fai clic su "OK".
Quindi, crea un cerchio blu delle stesse dimensioni del cerchio rosso. Convertilo in un Movie Clip, esportalo per ActionScript e assegnagli un nome di classe "Blue". Elimina i due cerchi dallo stage, in modo che l'unico clip filmato rimanente sia il Movie Clip.
Vai a http://code.google.com/p/as3corelib/ e scarica la cartella zip as3corelib. Con il codificatore JPEG, saremo in grado di salvare un'immagine delle nostre piccole immagini.
Questa è la cornice di base in cui metteremo tutto il nostro codice.
pacchetto import flash.display.Sprite; public class saveFile estende Sprite public function saveFile ()
Ecco le istruzioni di importazione per far funzionare l'applicazione Air. Questi andranno nel file subito sotto la dichiarazione del pacchetto e sopra la dichiarazione della classe pubblica.
import com.adobe.images.JPGEncoder; import flash.desktop.NativeApplication; import flash.display.BitmapData; import flash.display.MovieClip; import flash.display.Sprite; import flash.events.Event; import flash.events.InvokeEvent; import flash.events.MouseEvent; import flash.filesystem.File; import flash.filesystem.FileMode; import flash.filesystem.FileStream; import flash.net.FileFilter; import flash.utils.ByteArray;
Ecco le variabili che stiamo usando per creare i due piccoli cerchi sul palco. Le variabili di offset verranno utilizzate in seguito per il trascinamento e il rilascio dei cerchi.
Ho anche assegnato un listener di eventi invoke a NativeApplication. Questo si attiva quando l'applicazione viene avviata o quando si fa clic sul file personalizzato. La funzione invoke controllerà per vedere come è stata lanciata l'app. Se proveniva da un file, caricherà il file. In caso contrario, chiamerà la funzione init.
public class saveFile estende Sprite private var red: MovieClip; private var blue: MovieClip; private var currentClip: MovieClip; private var xOffset: Number; private var yOffset: Number; public function saveFile () NativeApplication.nativeApplication.addEventListener (InvokeEvent.INVOKE, onInvoke); MovieClips (); ascoltatori (); funzione privata init (): void var sw: int = stage.stageWidth; var sh: int = stage.stageHeight-footer.height; red.x = sw * Math.random (); red.y = sh * Math.random (); blue.x = sw * Math.random (); blue.y = sh * Math.random (); funzione privata movieClips (): void red = new Red (); blu = nuovo blu (); this.addChildAt (red, 0); this.addChildAt (blue, 1); this.addChildAt (footer, 2);
Questa funzione imposta semplicemente i listener di eventi per tutti i pulsanti e i cerchi sul palco.
private function listeners (): void red.addEventListener (MouseEvent.MOUSE_DOWN, onDown); blue.addEventListener (MouseEvent.MOUSE_DOWN, onDown); footer.open.addEventListener (MouseEvent.CLICK, openClick); footer.save.addEventListener (MouseEvent.CLICK, saveClick); footer.image.addEventListener (MouseEvent.CLICK, imageClick);
Qui impostiamo le funzioni per spostare i cerchi attorno al palco.
funzione privata onDown (event: MouseEvent): void currentClip = event.target come MovieClip; xOffset = mouseX - currentClip.x; yOffset = mouseY - currentClip.y; currentClip.removeEventListener (MouseEvent.MOUSE_DOWN, onDown); this.addEventListener (MouseEvent.MOUSE_UP, onUp, false, 0, true); this.addEventListener (MouseEvent.MOUSE_MOVE, onMove, false, 0, true); funzione privata onMove (event: MouseEvent): void currentClip.x = mouseX - xOffset; currentClip.y = mouseY - yOffset; event.updateAfterEvent (); funzione privata onUp (event: MouseEvent): void this.removeEventListener (MouseEvent.MOUSE_MOVE, onMove); this.removeEventListener (MouseEvent.MOUSE_UP, onUp); currentClip.addEventListener (MouseEvent.MOUSE_DOWN, onDown, false, 0, true);
Quando viene cliccato il pulsante "Immagine", chiamerà la funzione "imageClick". Questa funzione apre una finestra di dialogo di salvataggio e puoi dare alla tua immagine il nome che desideri. Quando l'utente nomina l'immagine, chiamerà la funzione "imageSave". All'interno di questa funzione, usiamo la classe JPGEncoder per creare l'immagine. L'app Air salva quindi l'immagine e ascolta la funzione "onClose". Quella funzione riassegna semplicemente i piccoli cerchi allo stage dallo sprite temporaneo che è stato creato.
funzione privata imageClick (event: MouseEvent): void var file: File = File.desktopDirectory; file.browseForSave ("Salva immagine"); file.addEventListener (Event.SELECT, imageSave); funzione privata imageSave (event: Event): void var temp: Sprite = new Sprite (); var len: int = this.numChildren; temp.addChild (rosso); temp.addChild (blu); var bitmapData: BitmapData = new BitmapData (stage.stageWidth, stage.stageHeight); BitmapData.draw (temp); var jpg: JPGEncoder = new JPGEncoder (100); var byteArray: ByteArray = jpg.encode (bitmapData); var saveFile: File = File (event.target); var directory: String = saveFile.url; if (directory.indexOf (". jpg") == -1) directory + = ".jpg"; var file: File = new File (); file = file.resolvePath (directory); var fileStream: FileStream = new FileStream (); fileStream.addEventListener (Event.CLOSE, onClose); fileStream.openAsync (file, FileMode.WRITE); fileStream.writeBytes (ByteArray); fileStream.close (); private function onClose (event: Event): void this.addChildAt (red, 0); this.addChildAt (blue, 1);
(Nota dell'editore: il commentatore Jesse ci ha fatto sapere che il modo in cui la classe File è cambiata da quando è stato pubblicato questo tutorial. Vedi il suo commento per ulteriori dettagli su come rendere il tuo codice compatibile).
Dopo aver spostato un po 'i piccoli cerchi, possiamo salvare la loro posizione per ulteriori modifiche. Qui creiamo il nostro file personalizzato. Per prima cosa inseriamo le coordinate in un array, quindi gli array vengono inseriti in un oggetto. L'oggetto è scritto su un file con la nostra estensione di file personalizzata. Puoi dargli qualsiasi estensione tu voglia.
Successivamente, impostiamo l'app come applicazione predefinita per l'estensione di file appena creata.
funzione privata saveClick (event: Event): void var file: File = File.desktopDirectory file.browseForSave ("Salva"); file.addEventListener (Event.SELECT, onSaveSelect); funzione privata onSaveSelect (event: Event): void var object: Object = ; var redArray: Array = [red.x, red.y]; var blueArray: Array = [blue.x, blue.y]; object.RED = redArray; object.BLUE = blueArray; var saveFile: File = File (event.target); var directory: String = saveFile.url if (directory.indexOf (". tuts") == -1) directory + = ".tuts"; var file: File = new File (); file = file.resolvePath (directory); var fileStream: FileStream = new FileStream (); fileStream.open (file, FileMode.WRITE); fileStream.writeObject (oggetto); fileStream.close (); NativeApplication.nativeApplication.setAsDefaultApplication ( "tuts");
Se vuoi aprire il tuo file appena creato, fai semplicemente clic sul pulsante "Apri". Appare una finestra di dialogo che sembra solo per quella estensione di file. L'app leggerà quindi l'oggetto all'interno del file e posizionerà i piccoli cerchi di conseguenza.
funzione privata openClick (event: MouseEvent): void var file: File = File.desktopDirectory; file.addEventListener (Event.SELECT, onSelect); file.browseForOpen ("Apri", [nuovo FileFilter ("File Tuts (* .tuts)", "* .tuts")]); funzione privata onSelect (event: Event): void var file: File = File (event.target); var fileStream: FileStream = new FileStream (); fileStream.open (file, FileMode.READ); oggetto var: Object = fileStream.readObject (); red.x = object.RED [0]; red.y = object.RED [1]; blue.x = object.BLUE [0]; blue.y = object.BLUE [1]; fileStream.close ();
Questa è la funzione invoke. Senza questa funzione, se dovessi avviare l'applicazione dal tuo nuovo file, non saprebbe caricarlo. Questa funzione controlla per vedere cosa gli ha detto di aprire. Se si trattasse di un file, caricherà quel file. In caso contrario, chiama semplicemente la funzione "init" che dà ai cerchi un posizionamento casuale.
funzione privata onInvoke (event: InvokeEvent): void if (event.currentDirectory! = null && event.arguments.length> 0) var directory: File = event.currentDirectory; var file: File = directory.resolvePath (event.arguments [0]); var fileStream: FileStream = new FileStream (); fileStream.open (file, FileMode.READ); oggetto var: Object = fileStream.readObject (); red.x = object.RED [0]; red.y = object.RED [1]; blue.x = object.BLUE [0]; blue.y = object.BLUE [1]; fileStream.close (); else init ();
Quando il file è stato testato e funziona correttamente, siamo pronti per la pubblicazione. Vai a Comandi> AIR - Impostazioni applicazione e programma di installazione e visualizza le impostazioni di pubblicazione.
Nelle impostazioni di pubblicazione Air, fai clic sulle impostazioni avanzate.
Verrà visualizzata un'altra finestra di dialogo. Fare clic sul pulsante "più" per aggiungere un'estensione di file.
Compila le descrizioni dei file, seleziona le tue icone personalizzate e fai clic su "OK" fino a quando non torni alla prima finestra delle impostazioni di pubblicazione.
L'ultima cosa da fare è pubblicare il tuo file. Fare clic sul pulsante "Pubblica file AIR". Dovrai creare un certificato per firmare l'app. Fai semplicemente clic su "Crea" per visualizzare le impostazioni.
Compila il modulo e fai clic su "OK". Flash ti chiederà quando viene creato il certificato. Una volta creato il certificato, inserire la password e il file verrà creato.
Questo era solo un esempio di base di ciò che si può fare con questa tecnica. Potresti anche creare una sorta di applicazione di disegno in cui puoi salvare ciò che hai disegnato o continuare a modificarlo. O se si desidera creare un lettore MP3 personalizzato e avere il proprio formato di file di playlist. Le possibilità sono infinite…
Spero ti sia piaciuto seguire il tut.