Este tutorial le explicará cómo hacer sus propias extensiones de archivo en Adobe AIR. Le mostraré cómo construir una aplicación pequeña, guardar las posiciones de un par de clips de video dentro de ella y volver a cargarlos cuando se inicie la aplicación.
Siga adelante y vea si puede encontrar sus propios usos para las extensiones de archivo personalizadas ...
Abra un nuevo documento de Flash Air, asígnele el nombre "saveFile" y guárdelo en una nueva carpeta. Luego, abra un nuevo archivo ActionScript, asígnele el mismo nombre y guárdelo en la misma carpeta que el documento Flash recién creado..
Si la pantalla de solicitud no aparece cuando se inicia Flash, simplemente cree un nuevo documento Flash ActionScript 3. Guarde el archivo y luego vaya a Comandos> AIR - Configuración de la aplicación y del instalador. Flash convertirá el archivo a un documento de Air.
En el panel de propiedades del documento de Flash, escriba "saveFile" en el campo Clase de documento. Esto asociará el nuevo archivo ActionScript (nuestra clase de documento) con el documento de Flash.
Crea un cuadrado negro con una altura de 52, establece el ancho para que sea el ancho del escenario y alinéalo con la parte inferior izquierda del escenario. Dale al cuadrado un alfa de 33. En el panel de componentes, arrastra tres botones y colócalos sobre el cuadrado negro.
Dé a uno de los botones un nombre de instancia de "abierto" y cambie su etiqueta para que diga "Abrir". El siguiente botón tendrá un nombre de instancia de "guardar" y su etiqueta será "Guardar". El tercer nombre de los botones será "imagen" y tendrá una etiqueta de "Imagen". Distribúyalos como desee, seleccione los tres botones y el cuadrado negro y conviértalos en un solo clip de película que tiene un nombre de instancia de "pie de página".
En el escenario, crea un círculo rojo con una altura y un ancho de 50 px. Conviértalo en un movieclip, luego en el cuadro de diálogo, presione el botón "Avanzado". Debajo de "Enlace" marque la casilla "Exportar para ActionScript". Déle un nombre de clase de "Rojo" y haga clic en "Aceptar".
A continuación, cree un círculo azul que tenga el mismo tamaño que el círculo rojo. Conviértalo en un movieclip, expórtelo para ActionScript y asígnele un nombre de clase de "Azul". Elimine los dos círculos del escenario, de modo que el único clip de movimiento restante sea el movieclip de pie de página.
Vaya a http://code.google.com/p/as3corelib/ y descargue la carpeta zip as3corelib. Con el codificador JPEG, podremos guardar una imagen de nuestros cirlces pequeños.
Este es el marco básico donde pondremos todo nuestro código..
paquete import flash.display.Sprite; La clase pública saveFile extiende Sprite public function saveFile ()
Aquí están las declaraciones de importación para hacer que la aplicación Air funcione. Estos irán en el archivo justo debajo de la declaración del paquete y sobre la declaración de la clase pública.
importar com.adobe.images.JPGEncoder; importar flash.desktop.NativeApplication; importar flash.display.BitmapData; importar flash.display.MovieClip; importar flash.display.Sprite; import flash.events.Event; import flash.events.InvokeEvent; import flash.events.MouseEvent; importar flash.filesystem.File; importar flash.filesystem.FileMode; importar flash.filesystem.FileStream; importar flash.net.FileFilter; import flash.utils.ByteArray;
Aquí están las variables que estamos usando para crear los dos pequeños círculos en el escenario. Las variables de desplazamiento se utilizarán más adelante para arrastrar y soltar los círculos..
También he asignado un detector de eventos de invocación a NativeApplication. Esto se activará cuando la aplicación se inicie o cuando se haga clic en el archivo personalizado. La función de invocación verificará cómo se lanzó la aplicación. Si era de un archivo, cargará el archivo. Si no, llamará a la función init..
La clase pública saveFile extiende Sprite private var red: MovieClip; var privado: MovieClip; privado var currentClip: MovieClip; privado var xOffset: Número; privada var yOffset: Número; función pública saveFile () NativeApplication.nativeApplication.addEventListener (InvokeEvent.INVOKE, onInvoke); movieClips (); oyentes (); función privada 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 (); función privada movieClips (): void red = new Red (); azul = azul nuevo (); this.addChildAt (rojo, 0); this.addChildAt (azul, 1); this.addChildAt (pie de página, 2);
Esta función simplemente configura los oyentes de eventos para todos los botones y círculos en el escenario.
escuchas de funciones privadas (): 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);
Aquí configuramos las funciones para mover los círculos alrededor del escenario..
función privada onDown (event: MouseEvent): void currentClip = event.target as 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); función privada onMove (evento: MouseEvent): void currentClip.x = mouseX - xOffset; currentClip.y = mouseY - yOffset; event.updateAfterEvent (); función privada onUp (evento: MouseEvent): void this.removeEventListener (MouseEvent.MOUSE_MOVE, onMove); this.removeEventListener (MouseEvent.MOUSE_UP, onUp); currentClip.addEventListener (MouseEvent.MOUSE_DOWN, onDown, false, 0, true);
Cuando se haga clic en el botón "Imagen", se llamará a la función "imageClick". Esta función abre un cuadro de diálogo para guardar y le puede dar a su imagen el nombre que desee. Cuando el usuario nombre la imagen, llamará a la función "imageSave". Dentro de esa función, usamos la clase JPGEncoder para crear la imagen. La aplicación Air guarda la imagen y escucha la función "onClose". Esa función simplemente reasigna los círculos pequeños al escenario del sprite temporal que se creó.
función privada imageClick (evento: MouseEvent): void var file: File = File.desktopDirectory; file.browseForSave ("Guardar imagen"); file.addEventListener (Event.SELECT, imageSave); función privada imageSave (evento: Evento): void var temp: Sprite = new Sprite (); var len: int = this.numChildren; temp.addChild (rojo); temp.addChild (azul); var bitmapData: BitmapData = new BitmapData (stage.stageWidth, stage.stageHeight); bitmapData.draw (temp); var jpg: JPGEncoder = nuevo 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 (); archivo = archivo.resolvePath (directorio); var fileStream: FileStream = new FileStream (); fileStream.addEventListener (Event.CLOSE, onClose); fileStream.openAsync (file, FileMode.WRITE); fileStream.writeBytes (byteArray); fileStream.close (); función privada onClose (evento: Evento): void this.addChildAt (red, 0); this.addChildAt (azul, 1);
(Nota del editor: el comentarista Jesse nos ha informado que la forma en que funciona la clase de archivos ha cambiado desde que se publicó este tutorial. Consulte su comentario para obtener más detalles sobre cómo hacer que su código sea compatible)
Después de haber movido un poco los círculos pequeños, podemos guardar su ubicación para seguir editando. Aquí creamos nuestro archivo personalizado. Primero ponemos las coordenadas en una matriz, luego las matrices se colocan dentro de un objeto. El objeto se escribe en un archivo con nuestra extensión de archivo personalizada. Puedes darle la extensión que quieras..
Después de eso, configuramos la aplicación como la aplicación predeterminada para la extensión de archivo recién creada..
función privada saveClick (evento: Evento): void var file: File = File.desktopDirectory file.browseForSave ("Save"); file.addEventListener (Event.SELECT, onSaveSelect); función privada onSaveSelect (evento: Evento): 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 (); archivo = archivo.resolvePath (directorio); var fileStream: FileStream = new FileStream (); fileStream.open (archivo, FileMode.WRITE); fileStream.writeObject (objeto); fileStream.close (); NativeApplication.nativeApplication.setAsDefaultApplication ("tuts");
Si desea abrir su archivo recién creado, simplemente haga clic en el botón "Abrir". Aparece un cuadro de diálogo que solo busca esa extensión de archivo. La aplicación leerá el objeto dentro del archivo y colocará los círculos pequeños en consecuencia..
función privada openClick (evento: MouseEvent): void var file: File = File.desktopDirectory; file.addEventListener (Event.SELECT, onSelect); file.browseForOpen ("Open", [new FileFilter ("Tuts Files (* .tuts)", "* .tuts")]); función privada onSelect (evento: Evento): void var file: File = File (event.target); var fileStream: FileStream = new FileStream (); fileStream.open (archivo, FileMode.READ); objeto 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 ();
Esta es la función de invocación. Sin esta función, si lanzara la aplicación desde su nuevo archivo, no sabría cargarla. Esta función comprueba para ver qué le dijo a abrir. Si era un archivo, entonces cargará ese archivo. Si no fue así, simplemente llama a la función "init" que le da a los círculos una ubicación aleatoria.
función privada 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 (archivo, FileMode.READ); objeto 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 ();
Cuando todo el archivo está probado y funcionando correctamente, estamos listos para publicar. Vaya a Comandos> AIR - Configuración de la aplicación e instalador, y muestre la configuración de publicación.
En la configuración de publicación de aire, haga clic en la configuración avanzada.
Se abrirá otro cuadro de diálogo. Haga clic en el botón "más" para agregar una extensión de archivo.
Complete las descripciones de los archivos, seleccione sus iconos personalizados y haga clic en "Aceptar" hasta que vuelva a la primera ventana de configuración de publicación..
Lo último que debes hacer es publicar tu archivo. Haga clic en el botón "Publicar archivo de AIR". Deberá crear un certificado para firmar la aplicación. Simplemente haga clic en "Crear" para que aparezca la configuración.
Rellene el formulario y haga clic en "Aceptar". Flash le avisará cuando se cree el certificado. Cuando se haga el certificado, ingrese la contraseña y se creará su archivo.
Esto fue solo un ejemplo básico de lo que se puede hacer con esta técnica. También puede crear algún tipo de aplicación de dibujo donde pueda guardar lo que ha dibujado o seguir editándolo. O si desea crear un reproductor de MP3 personalizado y tener su propio formato de archivo de lista de reproducción. Las posibilidades son infinitas…
Espero que hayan disfrutado siguiendo el tut.