Efecto de bandera en imagenes con BitmapData en Flash 8

Por: Teseo

22 de Enero del 2007

1401 de clabLevel
Otros artículos de Teseo

57,177 visitas

actionscript

Este efecto crea el movimiento de oscilación sinusoidal y sombreado basándose en una variación del perlinNoise sincronizado con un desplazamiento del mapa de bits. Es decir, hace que una imagen cualquiera que elijas se anime automáticamente como una bandera ondeando. Trabaja con cualquier tipo de imagen y transparencia. Al dibujar (draw) el motivo en en marco, ya le añadimos una matriz para agrandarlo verticalmente lo suficientemente dado que el movimiento de la imagen aumenta el tamaño original.

Código bandera

Código :

/*Importar cualquier imagen (jpg,png,bmp,gif) y vincular en la biblioteca
con nombre: imagen. Ajustar los parámetros de brillo, velocidad y
nº de ondas según gusto. El MC resultante es: bandera.  LISTO */
import flash.display.BitmapData;
import flash.geom.*;
import flash.filters.DisplacementMapFilter;
br = 180;// brillo de 0 a 256;
velo = 10;//velocidad viento (alabeo);
ond = 10;//nº de ondas que se crean (sombra);
img = BitmapData.loadBitmap("imagen");
w = img.width;
h = 4*img.height/3;
marco = new BitmapData(w, h, true, 0);
ola = marco.clone();
marco.draw(img, new Matrix(1, 0, 0, 1, 0, h/7));
marco2 = marco.clone();
createEmptyMovieClip("bandera", this.getNextHighestDepth());
bandera.attachBitmap(marco, 0);
off = new Point();
ond = ond*.16;
velo = velo*.26;
desMap = new DisplacementMapFilter(ola, null, 8, 8, 24, 20, "clamp");
onEnterFrame = function () {
   off.x -= velo*w/50;
   off.y -= velo*w/100;
   ola.perlinNoise(w, 2*h, 1, 0, true, true, 8, true, [offset]);
   marco.perlinNoise(w/ond, h/(ond*2), 1, 0, true, true, 7, true, [off]);
   marco.merge(marco2, marco.rectangle, null, br, br, br, 256);
   bandera.filters = [desMap];
};

También te interesa

• Cargar imágenes de otros dominios con PHP y Actionscript 3
• Insertar videos de youtube en Flash
• Contenedores escalables en Actionscript 2

actionscript

es un muy bien tip teseo
Por: DavilaCS

Ivan de Santiago_blog :

que necesito para implementar este ejemplo en flash player MX profecional 2004

Un corazón puro
Por: Freddie

Fx:
Siempre es bienvenida cualquier modificación o mejora.
Y por cierto, desde que puse el post.....
.....A nadie se le ocurrió pinchar en la bandera!?

Por: Teseo

Si, a mi si je je je, un golpe duro al diseño inteligente
Por: ramiro_olver@

ola.perlinNoise(w, 2*h, 1, 0, true, true, 8, true, [offset]);

ola.perlinNoise(w, 2*h, 1, 0, true, true, 8, true, [off]);

/*Importar cualquier imagen (jpg,png,bmp,gif) y vincular en la biblioteca
con nombre: imagen. Ajustar los parámetros de velocidad y
nº de ondas según gusto. El MC resultante es: bandera.  LISTO */
import flash.display.BitmapData;
import flash.geom.*;
import flash.filters.DisplacementMapFilter;
velo = 12;//velocidad viento (alabeo);
ond = 10;//nº de ondas que se crean (sombra);
img = BitmapData.loadBitmap("imagen");
w = img.width; h = 4*img.height/3;
marco = new BitmapData(w, h, true, 0); ola = marco.clone();
marco.draw(img, new Matrix(1, 0, 0, 1, 0, h/7)); marco2 = marco.clone();
createEmptyMovieClip("bandera", this.getNextHighestDepth());
bandera.attachBitmap(marco, 0);
off = new Point(); ond = ond*.16; velo = velo*.26;
desMap = new DisplacementMapFilter(ola,null,8,8,24,20,"color",0,0);
onEnterFrame = function () {
   off.x -= velo*w/50; off.y -= velo*w/100;
   ola.perlinNoise(w, h*2, 1, 0, true, true, 8, true, [off]);
   ola2= ola.clone();
   ola2.threshold(marco, marco.rectangle, null, "<",0xff000000 , 0);
   marco.draw(marco2);
   marco.draw(ola2, new Matrix(), null, 8);
   // es posible añadir uno o mas "draw" con un blendmode distinto para
   //reforzar el brillo, oscurecer u otro tipo de efectos. Ejemplo:
   // marco.draw(ola2,new Matrix(), null, 6);
   bandera.filters = [desMap];
}

Hola sabe apenas estoy con esto del Action, pero es muy bueno, pero cuando trto de cargar import flash.display.BitmapData;

tengo problemas me dice que no de ha podido cargar la clase flash.display.BitmapData;
por favor ayudenme
Por: castell_blog

Si es cierto...yo tampoc se ver como posicionar la bandera a lo largo del Stage....alguien tiene la solución??

spasmos
Por: spasmos

Encontrado, para mover la bandera se han de modificar los 2 ultimos valores de esta linea:
- marco.draw(img, new Matrix(1, 0, 0, 1, 0, h/7));

Que indican la X y la Y del bitmap.

spasmos
Por: spasmos_blog

¡¡¡TE SALES CHAVALL!!! Me quito el sombrero!! Gracias por compartir tu sabiduría
Por: Meyi-blog