Flex, AS3, AS2, flash, css
Archivo de febrero, 2008
Flex 2. Sistema planetario (Sol, Tierra, Luna y Júpiter) con Papervision3D 1.7
27 feb
Se trata de una variante de la entrada
Flex 2. Ejemplo básico de Papervision 3D 1.7 en Flex >>
Para facilitar la descarga, como no pesaba demasiado, he comprimido directamente el proyecto Flex. La desventaja, que no se puede consultar en el blog el código fuente.
Descargar código fuente (proyecto Flex completo)>>
El proyecto lleva incluídas las clases Papervision3D 1.7.
5978 Iconos gratis!!!
26 feb
Recursos web
25 feb
Hace unos días encontré phatfusion, una estupenda pagina con una colección de plugins y demás que me gustó bastante.
Un ejemplo de lo que puedes encontrar es:
Nos permite crear un Lightbox pero con archivos swf, mov, wmv, real, mp3, html…
Crea un menu con un interesante roolOver sobre imagenes
Adobe lanza AIR
25 feb
Tras dos años de desarrollo Adobe lanza finalmente AIR lo que sera en un futuro próximo el puente entre las aplicaciones de escritorio y las aplicaciones web.
Adobe esta preparando algunas de sus mas famosas aplicaciones para esta plataforma como son Photoshop Express para la edición de imagenes y Premiere Express para la edición de video.
Por aquí estamos como gatas en celo por ver alguna de esas 
Flash CS3. Ejemplo de utilización del filtro DisplacementMapFilter
25 feb
Aviso desde ya que este ejemplo ha salido un poco “Matrix”, y es algo cansado de ver.
Descargar código fuente y archivo Fla >>
El filtro DisplacementMapFilter -o filtro de mapa de desplazamiento-, se puede utilizar a partir de un mapa en escala de grises, pero para conseguir un mayor efecto 3D es aconsejable emplear normalsMap’s. Estos mapas los generan los programas de 3D como 3D Studio Max o Cinema 4D.
En 3D Studio tienes la posibilidad de generar un normalsMap para un objeto de baja resolución en el cuadro de diálogo del tostado de texturas (tecla 0).
Una vez generado el normalsMap (es una imagen que habrás guardado en formato tga o png) se le pasa como parámetro al filtro DisplacementMapFilter, y este se aplica a la imagen que quieras “inflar”. Para reforzar el efecto 3D, se puede colocar encima un sprite con las sombras renderizadas en 3D Studio.
En este ejemplo, imagen1.png contiene el normalsMap e imagen2.png muestra las sombras renderizadas del objeto
(ambos archivos puedes encontrarlos en el zip del código fuente).
Flex 2. Efecto humo en Flex
23 feb
He adaptado el ejemplo anterior para Flex, añadiéndole una pequeña interface que modifica el comportamiento de las partículas de humo. Puedes cambiar el color, velocidad, vida… de las partículas que se generan al interactuar con el visor.
Ver ejemplo y código fuente >>
Recuerda que para ver el código debes pulsar sobre el ejemplo con el botón derecho del ratón y elegir “View source”.
Flash CS3. Efecto humo
21 feb
Se trata de un ejemplo rápido para generar humo.
Empecé utilizando como partículas png’s con alpha, el efecto salía más conseguido (utilicé los sprites de Combustion para humo) pero se ralentizaba demasiado, así que he optado por dibujar circulos con gradientes de nivel alpha: creo 2 sprites por partícula para dar más sensación de caos.
A la partícula se le puede dar un color, aunque he optado por el humo blanco para no hacer un gas demasiado estridente.
Para generar el humo pulsa y arrastra el ratón sobre el visor.
Flex 3. Flash CS3. Pasos para determinar si una afirmación es cierta
17 feb
Es bastante habitual recurrir a Internet para obtener de forma rápida la información que se necesita, sin contrastarla, o comprobar la calidad de la fuente.
Circula entre los compañeros de trabajo un diagrama “infalible” para verificar cualquier tipo de información antes de utilizarla. Me hizo gracia, es más, casi me muero de la risa al leerlo la primera ver, y aquí está:
Ver ejemplo y código fuente >>
Descargar proyecto Flex completo (proyecto ActionScript)>>
Los símbolos gráficos se importan de “Biblioteca.swc”, que encontrarás en la carpeta src/assets. Va incluído el archivo Fla que genera “Biblioteca.swc”, por si quieres echarle un vistazo a los movieClips.
Utiliza los paquetes Tweener y Papervision3D 2 (GreatWhite). Puedes bajarte las bibliotecas compiladas de los siguientes enlaces:
Descargar biblioteca Tweener >>
Descargar biblioteca Papervision3D 2.0 GreatWhite >>
Las opciones que va mostrando las lee de un xml con sólo 3 nodos (el diagrama original tiene 3) pero no sería muy complicado adaptarlo para diagramas más extensos y complejos, siempre que cada opción sólo muestre las alternativas “Sí” y “No”.
El funcionamiento del ejemplo es bastante sencillo: hay que ir marcando las casillas Sí y No que van apareciendo.
Flex 2 + Tweener. AddCaller, Eventos, Plantillas y SetTimeScale
12 feb
Sigo con Tweener. He probado algunas cosas que tenia pendientes.
El primer ejemplo muestra el uso de addCaller. Mediante addCaller llamaremos a la función blick 40 veces en 10 segundos. Comenzará rápido y terminará lento siguiendo la función “easeinquad”. Con waitFrames forzaremos a esperar un frame como mínimo entre cada evento.
El segundo muestra como lanzar los eventos onStart, onUpdate y onComplete utilizando addTween.
El tercero muestra como utilizar plantillas para crear nuestras animaciones.
Por último he añadido un stepper que controla la velocidad de las animaciones utilizando la funcion Tweener.setTimeScale(…).
Podeis encontrar el manual de Tweener en http://hosted.zeh.com.br/tweener/docs/en-us/
AIR beta 3. Carrusel de imagenes
9 feb
Carrusel de imágenes en AIR. El carrusel de imagenes es solo la escusa para mostrar como hacer una aplicación AIR transparente y que se minimice a la bandeja de sistema.
