Hola de nuevo a todos, ya han pasado unos cuantos días ( y os pedimos perdón desde aquí ) desde que la primera reunión online de MadeInFlex se celebrara. El retraso para ir colgando las charlas se debe a unos problemas de permisos y al ajetreo que tenemos últimamente todos.

Como os comentamos en su momento, nuestra intención es la de ir presentando todo el material de las charlas en forma de entradas en la web y enlaces a las conferencias grabadas, tanto para dar un mayor ámbito al artículo como para poder repasar y estudiar todas las charlas que, por falta de tiempo, se tuvieron que acelerar o cortar.

Pues bien, la charla que ofrecí llevaba por título “Efectos en Flex 2.0� y pretendía ser un repaso a los efectos en Flex 2.0 que iría, desde qué entendemos por efectos en Flex 2.0, hasta qué podemos llegar a hacer con ellos.

Definición de efecto

En el punto 1, damos un primer enfoque de qué entendemos por efecto, tipos de efectos: animados, filtros bitmap, tranformaciones geométricas, custom effects…

Efectos animados en Adobe Flex 2.0: mx.effects

El segundo punto analiza los efectos animados, basados en la clase TweenEffect, que podemos encontrar en Adobe Flex 2.0. En este punto aprenderemos a buscar, definir y utilizar estos efectos ( Move, Resize, Rotate, Glow, etc ) además de dar unas pequeñas nociones de uso y rendimiento al final del punto.

Filtros bitmap: flash.filters

El punto tercero repasa una gran parte de los filtros bitmap que podemos utilizar en Flex 2.0. Tanto imágenes como componentes en Flex 2.0 tienen una representación bitmap que podemos variar para expresar diferentes sensaciones. Muchos de estos filtros ( Emboss, Sharpen, Saturation, Brightness, Edge Detection, etc ) los podemos encontrar como parte de los efectos predefinidos en muchos programas de tratamiento de imágenes como Adobe Photoshop. Algunos de estos efectos utilizan matrices de color o convolución para generarse con lo que también hacemos una pequeña explicación de las mismas.

Transformaciones geométricas

El punto 4 nos ilustra el proceso de cómo deformar imágenes y componentes del framework de Flex 2.0. Mediante una matriz de transformación, podemos aplicar efectos de Rotación, Escalado, Deformación y Traslación.

Custom Effects

Por último, el quinto punto sirve para ver hasta que extremo se pueden personalizar y combinar todo lo anterior visto para conseguir efectos espectaculares como: efectos 3D, flip, etc cubriendo así el vacío que existe en Flash Player para efectos 3D.

Consideraciones

Como consideraciones finales, haceros reflexionar sobre el uso de los efectos, su rendimiento en máquinas diferentes, el tiempo de desarrollo y, como no, en lo espectaculares que quedan!

Todos estos puntos los tenéis explicados en profundidad en el documento PPT/PDF de la charla que se adjunta más abajo.

Como grabamos la charla, dejamos a vuestra disposición el link a la misma donde podréis revivir la sesión:

[7] Made in Flex: Efectos en Flex 2.0 parte I
[8] Made in Flex: Efectos en Flex 2.0 parte II

De la misma forma que la charla, os dejamos también los ficheros fuente que sirvieron para ir siguiendo con ejemplos la explicación. En este fichero .zip encontrareis el proyecto 'Effects' para Flex Builder. Además, en la carpeta lib de este proyecto esta el componente ( swc ) de la ventana que utilizamos para los ejemplos de la charla; tendréis que añadir este swc a vuestro "Library Path" en Proyecto->Properties->Flex Build Path->Library Path->Add swc

[9] Descargar presentación: Efectos_PPT_PDF.zip
[10] Descargar proyecto para Flex Builder: Effects.zip

Si tenéis cualquier duda de instalación o compilación, hacedme llegar un comentario al final de este mismo artículo.