Flex, AS3, AS2, flash, css
Archivo de abril, 2008
Flex 3. Flash CS3. Ejemplo básico de material interactivo con componentes Flash CS3 y Papervision3D 1.7
28 abr
Aquí tenéis un ejemplo muy básico de cómo utilizar componentes de Flash CS3 en materiales interactivos de Papervision3D.
Se trata de un formulario 3D que puedes girar en el espacio presionando con el ratón, con varios campos de texto seleccionables en los que se puede escribir. Para enviar el formulario pulsa el botón inferior.
Ver ejemplo y código fuente >>
Descargar proyecto completo Flex >>
He utilizado Papervision3D 1.7 y Tweener. Te puedes descargar sus respectivas bibliotecas compiladas (swc) de los siguientes enlaces:
Descargar biblioteca Papervision3D 1.7 >>
Descargar biblioteca Tweener >>
Los componentes que he utilizado están en el archivo compilado ”src/assets/Biblioteca.swc”. Cuando hayas creado el proyecto Flex, ve a “Properties/Flex Build Path/Library path”, pulsa el botón “Add SWC…” y dale la ruta a Biblioteca.swc.
Este ejemplo es muuuuuy básico y lo he hecho muuuuy rápido 
. Algunas cosas que se podrían mejorar: desactivar la interactividad cuando se envía el formulario, para que la animación vaya más fluída; o activar el suavizado del material cuando el usuario deja de interactuar con él. Ya tenéis trabajo 
.
Flash CS3. LoaderInfo
27 abr
Cuando una aplicación carga archivos swf que a su vez cargan otros recursos (imágenes, archivos mp3, archivos flv, etc.) podemos llevarnos una desagradable sorpresa al comprobar que estos últimos no cargan nada.
En este ejemplo, tenemos una aplicación principal llamada LoaderInfo.swf que carga dos archivos swf: PeliculaA.swf y PeliculaB.swf. Ambos archivos deberían mostrar lo mismo, la imagen de un muro (fondoA.jpg), y sobre él otra imagen mostrando un graffiti (imagenes/graffitiA.jpg), que carga de la carpeta imágenes.
Tanto PelículaA.swf como PeliculaB.swf están en la carpeta “swf” del servidor, y dentro de ella se encuentra la carpeta “imagenes” de donde se carga “graffitiA.jpg”. Sin embargo, PeliculaB.swf no carga su graffiti de esta carpeta, sino de otra que he colocado en el directorio raíz, también llamada “imagenes”. Así explicado parece algo confuso, pero si descomprimes el archivo zip con el proyecto Flex, verás claramente la estructura de carpetas, y cómo PeliculaB.swf se “equivoca” al buscar “imagenes/graffitiA.jpg” en la carpeta raíz, donde está la aplicación principal LoaderInfo.swf, y no en la carpeta “swf”, donde se encuentra.
Este comportamiento es debido a que cuando un swf carga a otro, sigue siendo el “dueño de stage” y todo se referencia a él, incluidas las rutas relativas. Para evitarlo, podemos consultar la propiedad “root.loaderInfo.url” del swf cargado para saber exactamente “donde se encuentra”. Esto último lo hace el archivo PeliculaA.swf gracias al método “getUrl” que hemos implementado, cargando la imagen correcta “swf/imagenes/graffitiA.jpg”.
Descargar proyecto Flex completo >>
Se trata de un proyecto ActionScript.
Flash Player 9. Actualización
24 abr
Acaba de salir una actualización de Flash Player 9 que soluciona un grave problema de seguridad. Sería conveniente que te pasaras por la página de Adobe para actualizarte. Salió el 17 de abril de 2008, y actualiza Flash Player a la versión 9.0.124.0.
Flex 3. Flash CS3. AS3GeomClassExporter, otro ejemplo
24 abr
Aquí tenéis otro ejemplo de utilización de AS3GeomClassExporter
Ver ejemplo y código fuente >>
Descargar biblioteca Papervision3D 2.0 GreatWhite >>
Descargar versión para Flash CS3 (no lleva el paquete PV3D GreatWhite incluído) >>
Si te bajas la versión para Flash CS3 recuerda configurar AS3 para Papervision3D GreatWhite.
En este caso, pasamos a la clase que crea el objeto 3D un material “BitmapFileMaterial” que carga la textura que previamente se tostó en 3DS Max.
P.D.: Papervision3D 2.0 ha cambiado la forma de crear una instancia de un escenario 3d:
var miEscenario:Scene3D = new Scene3D();
Ya no es necesario añadir el valor booleano.
Flex 3. Flash CS3. AS3GeomClassExporter
24 abr
3DS Max permite exportar objetos con texturas en formato Collada (.dae), para utilizarlos con Papervision3D. Esta forma de integrar elementos 3D en Flash tiene la ventaja de ser bastante cómoda: creas la geometría en Max, la texturizas, haces el tostado de texturas y exportas el archivo .dae, que cargarás más tarde con Papervision3D. Pero tiene el inconveniente de tener que cargar un archivo independiente del swf, que puede llegar a ser pesado (como el formato Collada es un xml, siempre nos queda la posibilidad de editarlo y reducirlo a su mínima expresión: las líneas que definen la geometría y las texturas).
Si no quieres hacer el anterior proceso, en el siguiente enlace te puedes descargar un script para 3DS Max desarrollado por Dreammania:
Descargar AS3GeomClassExporter >>
Si tienes problemas con el anterior enlace prueba a descargarlo desde aquí:
AIR. Navegador web con el componente HTML
6 abr
Gracias al componente HTML es casi inmediato hacer un navegador web con AIR. Utiliza WebKit para procesar y renderizar los contenidos html y javascript, como el navegador Safari.
Descargar proyecto exportado con Flex 3 >>
El navegador es muy básico, me he limitado a colocar en la ventana de la aplicación (WindowedApplication) el componente HTML, un componente TextInput para introducir las direcciones web y dos botones para desplazarse por el historial de navegación.
Flex 3. Flash CS3. BulkLoader
5 abr
Se trata de otro ejemplo de utilizacion de BulkLoader. El anterior me salió “poco pesado”, una cualidad muy apreciada en las personas, pero menos conveniente en este caso .
Ver ejemplo y código fuente >>
Descargar proyecto Flex 3 completo >>
Descargar biblioteca BulkLoader >>
Descargar biblioteca Tweener >>
Se trata de un proyecto ActionScript, por lo que puede utilizarse desde Flash CS3. Los filtros que se aplican a las imágenes son filtros de convolución (ConvolutionFilter): desenfoque, detección de bordes, nitidez, etc; y filtros ColorMatrix (ColorMatrixFilter): blanco y negro, negativo, canales de color, etc.
Como viene siendo costumbre, las imágenes no están incluídas en el archivo zip, y se trata de las de siempre . En este caso he utilizado 20 imágenes cuadradas: imagen1.jpg, …., imagen20.jpg. Puedes coger 20 imágenes propias que te gusten y llamarlas así, o pasarte por la carpeta de la caché de tu navegador web y recuperarlas.
Por cierto, últimamente estamos posteando proyectos exportados con Flex 3. En principio no debe dar mucho problema utilizar el código con Flex 2, ya que se trata de archivos zip.
P.D.: Me he inspirado (ahora se llama así a copiar descaradamente) para este ejemplo en una aplicación web bastante popular. Doy una pista para el que no la haya reconocido: empieza por Photoshop y acaba por Express.
Flex 3. BulkLoader
4 abr
BulkLoader es un paquete de clases ActionScript 3 desarrollado por Arthur Debert que permite de forma fácil gestionar la precarga de los recursos que vamos a utilizar en nuestra aplicación web.
Con BulkLoader puedes hacer una precarga de cualquier tipo de recurso que vayas a utilizar en tu aplicación: imágenes, archivos de sonido mp3, archivos de vídeo flv, datos en xml, etc. Y tiene la gran ventaja de ser muy fácil de utilizar.
