Creați o aplicație AIR pentru extensia de fișiere personalizate

Acest tutorial va explica cum să creați propriile extensii de fișiere în Adobe AIR. Vă voi arăta cum să construiți o aplicație mică, să salvați pozițiile unui cuplu de movieclips în ea și să le reîncărcați când este lansată aplicația.

Urmați de-a lungul și vedeți dacă puteți veni cu propriile dvs. utilizări pentru Extensii personalizate de fișiere ...


Actualizați Flash Player


Pasul 1: Configurarea documentului

Deschideți un nou document Flash Air, numiți-l "saveFile" și salvați-l într-un folder nou. Apoi, deschideți un nou fișier ActionScript, dați-i același nume și salvați-l în același folder ca și noul document Flash creat.

Dacă ecranul prompt nu apare atunci când Flash pornește, creați un nou document Flash ActionScript 3. Salvați fișierul, apoi mergeți la Comenzi> AIR - Setări aplicație și instalator. Flash va converti fișierul într-un document Air.

În panoul de proprietăți al documentului Flash, tastați "saveFile" în câmpul Document class. Aceasta va asocia noul fișier ActionScript (clasa noastră de documente) cu documentul Flash.

Pasul 2: Adăugarea comenzilor

Creați un pătrat negru cu o înălțime de 52, setați lățimea care este lățimea treptei și aliniați-o la stânga jos a scenei. Dați pătratului un alfa de 33. În panoul componente, trageți trei butoane și plasați-le pe partea superioară a pătratului negru.

Dați unul dintre butoane un nume de instanță "deschis" și schimbați eticheta acestuia pentru a spune "Deschide". Următorul buton va avea un nume de instanță "salvați", iar eticheta acestuia va fi "Salvați". Al treilea nume de buton va fi "imagine" și va avea o etichetă cu "Imagine". Împărțiți-le tot ce doriți, selectați toate cele trei butoane și pătratul negru și transformați-le într-un singur filigran care are un nume de instanță de "subsol".

Pasul 3: Cercuri mici

Pe scenă, creați un cerc roșu cu o înălțime și o lățime de 50 de pixeli. Conversați-l într-un filmulet, apoi în caseta de dialog, apăsați butonul "Advanced". Sub "Linkage" bifați caseta "Export pentru ActionScript". Dați-i un nume de clasă "Red" și faceți clic pe "OK".

Apoi, creați un cerc albastru, care are aceeași dimensiune ca și cercul roșu. Convertiți-l într-un movieclip, exportați-l pentru ActionScript și dați-i un nume de clasă "Blue". Ștergeți cele două cercuri din stadiu, astfel încât singura movieclip rămas este footerul movieclip.

Pasul 4: Descărcați encoderul Adobe JPEG

Accesați http://code.google.com/p/as3corelib/ și descărcați folderul as3corelib zip. Cu ajutorul codorului JPEG, vom putea salva o imagine a micilor noastre cadre.

Pasul 5: Scheletul clasei de documente

Acesta este cadrul de bază în care ne vom pune tot codul.

 pachet import flash.display.Sprite; public class saveFile extinde Sprite funcția publică saveFile () 

Pasul 6: Importurile

Iată instrucțiunile de import pentru ca aplicația Air să funcționeze. Acestea se vor afla în fișier chiar sub declarația pachetului și deasupra instrucțiunii de clasă publică.

 import com.adobe.images.JPGEncoder; import flash.desktop.NativeApplication; import flash.display.BitmapData; import flash.display.MovieClip; import flash.display.Sprite; importul flash.events.Event; import flash.events.InvokeEvent; importul flash.events.MouseEvent; import flash.filesystem.File; import flash.filesystem.FileMode; import flash.filesystem.FileStream; import flash.net.FileFilter; import flash.utils.ByteArray;

Pasul 7: Variabilele și funcțiile de configurare

Iată variabilele pe care le folosim pentru a crea cele două cercuri mici de pe scenă. Variabilele de offset vor fi folosite ulterior pentru tragerea și plasarea cercurilor.

De asemenea, am alocat un invocator de evenimente invocate la NativeApplication. Aceasta se va declanșa când aplicația este lansată sau când se face clic pe fișierul personalizat. Funcția Invoke va verifica modul în care a fost lansată aplicația. Dacă a fost dintr-un fișier, acesta va încărca fișierul. Dacă nu, se va apela funcția inițială.

 class public saveFile extinde Sprite private var red: MovieClip; private var albastru: MovieClip; private var currentClip: MovieClip; privat var xOffset: Număr; private var offset: Număr; funcția publică saveFile () NativeApplication.nativeApplication.addEventListener (InvokeEvent.INVOKE, onInvoke); movieClips (); ascultători ();  funcția privată init (): void var sw: int = stage.stageWidth; var sh: int = stadiu.clasăHeight-footer.height; ro.x = sw * Math.random (); ro.y = sh * Math.random (); albastru.x = sw * Math.random (); albastru.y = sh * Math.random ();  funcția privată movieClips (): void red = new Red (); albastru = nou Albastru (); this.addChildAt (roșu, 0); this.addChildAt (albastru, 1); this.addChildAt (subsolul 2); 

Pasul 8: Funcția ascultătorilor

Această funcție stabilește pur și simplu ascultătorii evenimentelor pentru toate butoanele și cercurile de pe scenă.

 ascultători de funcții private (): 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, imagineClick); 

Pasul 9: Mutarea cercurilor mici

Aici am setat funcțiile pentru a muta cercurile în jurul scenei.

 funcția privată onDown (eveniment: MouseEvent): void currentClip = event.target ca MovieClip; xOffset = mouseX - currentClip.x; yOffset = mouseY - currentClip.y; currentClip.removeEventListener (MouseEvent.MOUSE_DOWN, onDown); acest.addEventListener (MouseEvent.MOUSE_UP, onUp, false, 0, adevărat); this.addEventListener (MouseEvent.MOUSE_MOVE, onMove, false, 0, adevărat);  funcția privată onMove (eveniment: MouseEvent): void currentClip.x = mouseX - xOffset; currentClip.y = mouseY - yOffset; event.updateAfterEvent ();  funcția privată onUp (eveniment: MouseEvent): void this.removeEventListener (MouseEvent.MOUSE_MOVE, onMove); this.removeEventListener (MouseEvent.MOUSE_UP, onUp); curentClip.addEventListener (MouseEvent.MOUSE_DOWN, onDown, false, 0, true); 

Pasul 10: Salvarea imaginii

Când se face clic pe butonul "Imagine", se va apela funcția "imageClick". Această funcție deschide o casetă de salvare a dialogului și puteți da imaginii dvs. orice nume doriți. Când utilizatorul numește imaginea, acesta va apela funcția "imageSave". În interiorul acestei funcții, folosim clasa JPGEncoder pentru a crea imaginea. Aplicația Air salvează apoi imaginea și asculta funcția "onClose". Această funcție redistribuie pur și simplu cercurile mici spre scenă de la sprite temp care a fost creat.

 funcția privată imageClick (eveniment: MouseEvent): void var file: File = File.desktopDirectory; file.browseForSave ("Salvați imaginea"); file.addEventListener (eveniment.SELECT, imagineSave);  funcția privată imageSave (eveniment: Eveniment): void var temp: Sprite = Sprite nou (); var len: int = this.numChildren; temp.addChild (roșu); temp.addChild (albastru); var bitmapData: BitmapData = BitmapData nou (stage.stageWidth, stage.stageHeight); BitmapData.draw (temp); var jpg: JPGEncoder = nou JPGEncoder (100); var byteArray: ByteArray = jpg.encode (bitmapData); var saveFile: Fișier = Fișier (event.target); var director: String = saveFile.url; dacă (director.indexOf (". jpg") == -1) director + = ".jpg";  fișier var: fișier = fișier nou (); fișier = file.resolvePath (director); var fileStream: FileStream = fișierul FileStream () nou; fileStream.addEventListener (Event.CLOSE, onClose); fileStream.openAsync (fișier, FileMode.WRITE); fileStream.writeBytes (byteArray); fileStream.close ();  funcția privată onClose (eveniment: Eveniment): void this.addChildAt (roșu, 0); this.addChildAt (albastru, 1); 

(Notă a editorului: Commenter Jesse ne-a informat că modul în care funcționează clasa File sa schimbat de la publicarea acestui tutorial. Consultați comentariul său pentru mai multe detalii despre cum să vă faceți codul compatibil.)

Pasul 11: Salvarea fișierului

După ce am mutat cercurile în jurul valorii de un pic, putem salva locația lor pentru editare ulterioară. Aici creăm fișierul personalizat. Mai întâi plasăm coordonatele într-o matrice, apoi matricele sunt plasate în interiorul unui obiect. Obiectul este scris într-un fișier cu extensia noastră personalizată. Puteți să-i dați orice extensie doriți.

Apoi, am setat aplicația ca fiind aplicația implicită pentru extensia de fișier nou creată.

 funcția privată saveClick (eveniment: Eveniment): void var file: File = File.desktopDirectory file.browseForSave ("Salvează"); file.addEventListener (Eveniment.SELECT, onSaveSelect);  funcția privată onSaveSelect (eveniment: Eveniment): void var object: Object = ; var redArray: Array = [red.x, ro.y]; var blueArray: Array = [albastru.x, albastru.y]; object.RED = redArray; object.BLUE = blueArray; var saveFile: Fișier = Fișier (event.target); var director: String = saveFile.url dacă (director.indexOf (". tuts") == -1) director + = ".tuts";  fișier var: fișier = fișier nou (); fișier = file.resolvePath (director); var fileStream: FileStream = fișierul FileStream () nou; fileStream.open (fișier, FileMode.WRITE); fileStream.writeObject (obiect); fileStream.close (); NativeApplication.nativeApplication.setAsDefaultApplication ( "Tuts"); 

Pasul 12: Deschiderea fișierului

Dacă doriți să deschideți fișierul nou creat, faceți clic pe butonul "Deschidere". Apare o casetă de dialog care arată numai acea extensie de fișier. Apoi, aplicația va citi obiectul din interiorul fișierului și va plasa corespunzător cercurile mici.

 funcția privată openClick (eveniment: MouseEvent): void var file: File = File.desktopDirectory; file.addEventListener (eveniment.SELECT, onSelect); file.browseForOpen ("Open", [new FileFilter ("Fișiere Tuts (* .tuts)", "* .tuts")]);  funcția privată onSelect (eveniment: Eveniment): void var file: File = Fișier (event.target); var fileStream: FileStream = fișierul FileStream () nou; fileStream.open (fișier, FileMode.READ); Obiect var: Object = fileStream.readObject (); red.x = obiect.RED [0]; red.y = object.RED [1]; blue.x = obiect.BLUE [0]; blue.y = obiect.BLUE [1]; fileStream.close (); 

Pasul 13: Invocarea aplicației

Aceasta este funcția de invocare. Fără această funcție, dacă ați lansat aplicația din noul fișier, nu ar ști să o încărcați. Această funcție verifică pentru a vedea ce a spus să se deschidă. Dacă a fost un fișier, atunci acesta va încărca acel fișier. Dacă nu a fost, atunci se numește pur și simplu funcția "init" care dă cercurilor o plasare aleatorie.

 funcția privată onInvoke (eveniment: InvokeEvent): void if (event.currentDirectory! = null && event.arguments.length> 0) var director: File = event.currentDirectory; var fișier: Fișier = director.resolvePath (event.arguments [0]); var fileStream: FileStream = fișierul FileStream () nou; fileStream.open (fișier, FileMode.READ); Obiect var: Object = fileStream.readObject (); red.x = obiect.RED [0]; red.y = object.RED [1]; blue.x = obiect.BLUE [0]; blue.y = obiect.BLUE [1]; fileStream.close ();  altceva init (); 

Pasul 14: Setările pentru publicare

Când fișierul este testat și funcționează corect, suntem gata să publicăm. Accesați Comenzi> AIR - Setări aplicație și instalare și aduceți la cunoștință setările de publicare.

Pasul 15: Configurarea extensiei de fișiere personalizate

În setările pentru publicarea aerului, faceți clic pe setările avansate.

Va deschide o altă casetă de dialog. Faceți clic pe butonul "plus" pentru a adăuga o extensie de fișier.

Completați descrierile fișierelor, selectați pictogramele personalizate și faceți clic pe "OK" până când vă întoarceți la prima fereastră de setări pentru publicare.

Pasul 16: Publicați fișierul

Ultimul lucru pe care trebuie să-l faceți este să vă publicați fișierul. Faceți clic pe butonul "Publicați fișierul AIR". Va trebui să creați un certificat pentru a semna aplicația. Pur și simplu dați clic pe "Creați" pentru a afișa setările.

Completați formularul și faceți clic pe "OK". Flash vă va solicita când certificatul este creat. Când se face certificatul, introduceți parola și fișierul va fi creat.

Concluzie

Acesta a fost doar un exemplu de bază a ceea ce se poate face cu această tehnică. Ați putea crea și un fel de aplicație de desen, unde puteți să salvați ceea ce ați tras sau să continuați să îl editați. Sau dacă doriți să creați un player MP3 personalizat și să aveți propriul format de fișier de redare. Posibilitățile sunt nesfârșite ...

Sper că ți-a plăcut să urmezi tut.

Cod