crear movieclip efecto espejo como youtube

quiero conseguir crear mediante actionscript un degradado trasparente a un movieclip. El degradado que quiero conseguir es el mismo que se ve en youtube (efecto espejo ). es decir, lo que quiero es dar la vuelta al movieclip y luego crear un degradado( en la parte superior que sea trasparente y en la inferior pues un color). que propiedad debo utilizar? he estado buscando en la ayuda de flash y he visto beginGradientFill y setTransform pero no he conseguido nada, además no sé si son adecuadas para hacer lo que yo quiero.

Algun consejo?

Hola, podrias hacerlo en photoshop o fireworks y luego solo importas la imagen a flash, en caso de que se trate de un logo o un menu.

Supongamos:
A. Que el fondo de tu pelicula es de color solido, es decir no son ni degradados, ni bitmaps ni nada que se le parezca.
B. Que el MC que deseas reflejar ya lo tienes dentro de tu Biblioteca (obvio), y que lo tienes vinculado para action Script con el indetificador "original"

Dadas estas primeras suponsicion, empezamos.

PASO 1:
Definiremos una variable que sea igual al color de fondo de la peli, como no existe una propiedad que haga eso (al menos no la se) , lo haremos a mano, el codigo necesario seria el siguiente:

Código ActionScript :

var fondo = 0xFFFFFF //Suponien que el color de fondo sea Blanco

Esta variable nos sera util mas adelante.

PASO 2:
Añadimos al escenario tu MC original, y lo colocamos en cierta posicion (x,y)

Código ActionScript :

this.attachMovie ('original', 'original_mc', _root.getNextHighestDepth()); 
original_mc._x = 10; // modifica este valor por la posicion Horizontal en que deseas aparezca tu MC
original_mc._y = 10; // modifica este valor por la posicion Vertical en que deseas aparezca tu MC

PASO 3:
Generamos la imagen de reflejo, la giramos 180º y la posicionamos debajo del MC original

Código ActionScript :

original_mc.duplicateMovieClip('reflejo_mc', _root.getNextHighestDepth()); //Duplicamos el MC original
reflejo_mc._rotation = 180; //Giramos el duplicado
reflejo_mc._x = original_mc._x + original_mc._width; //lo colocamos en la misma posicion Horizontal que el original, teniendo en cuanta que ha girado en base al punto de registro esq. sup izq. hay que añadirle el ancho del original
reflejo_mc._y = original_mc._y + (2*original_mc._height) + 1; //lo colocamos debajo del original, teniendo en cuenta el punto de registro, es necesario sumarle el doble del alto original mas 1 pixel, pues si no sumas uno saldra pegado y afeara el efecto

PASO 4:
Creamos el degradado que hara el efecto de desvanecimiento de la imagen en el supuesto piso tipo espejo, para esto utlizamos las propiedad .beginGradientFill:

Código ActionScript :

this.createEmptyMovieClip('efecto_mc', _root.getNextHighestDepth());
colores = [fondo, fondo]; //Aqui es donde utilizamos la variable definida al principio
tipo = "linear"; // Establecemos el tipo de degradado
alphas = [0, 100]; //Establecemos los niveles de alpha pudes variar el 0 para conseguir diferentes tipos de transparencia inicial
ratios = [0, 150]; //Establecemos la posicion inicial de cada color, los valores van de 0 a 255, peudes variar el 150 del ejemplo de aceurdo a tu gusto
matrix = {matrixType:"box", x:0, y:0, w:(original_mc._width), h:(original_mc._height), r:(90/180)*Math.PI}; // definimos la matriz ddel degradado.
efecto_mc.beginGradientFill(tipo, colores, alphas, ratios, matrix, 'pad', 'linearRGB');
efecto_mc.moveTo(0,0); //Empezamos a dibujar el cuadro que contendra el degradado utilizando la API de dibujo
efecto_mc.lineTo(original_mc._width,0); //utilizamos la propiedad _width para obtener el ancho del MC original e igualarla a nuestro efecto espejo
efecto_mc.lineTo(original_mc._width,original_mc._height); //utilizamos la propiedad _height apra obtener la altura del MC original e igualarla a nuestro efecto espejo
efecto_mc.lineTo(0,original_mc._height);
efecto_mc.lineTo(0,0);
efecto_mc.endFill(); //Terminamos el dibujo
efecto_mc._x = original_mc._x; //Posicionamos el efecto en el mismo punto Horizontal del original
efecto_mc._y = original_mc._y + original_mc._height + 1; //Posicionamos el efecto debajo de original mas 1 pixel esto lo coloca directamente encima del reflejo

Como se podra observar para posicionar el efecto de reflejo no se utlizaron las mismas formulas que para posicionar la imagen reflejada esto debido que al posicionar la imagen reflejada debiamos tener en cuenta que esta habia sido girada en base al punto de registro y el efecto de reflejo no habia sido girado.

El codigo completo sin comentario seria :

Código ActionScript :

var fondo = 0xFFFFFF;

this.attachMovie ('original', 'original_mc', _root.getNextHighestDepth());
original_mc._x = 10;
original_mc._y = 10;

original_mc.duplicateMovieClip('duplicado_mc',_root.getNextHighestDepth());
duplicado_mc._rotation = 180;
duplicado_mc._x = original_mc._x + original_mc._width;
duplicado_mc._y = original_mc._y + (2*original_mc._height) + 1;

this.createEmptyMovieClip('efecto_mc',_root.getNextHighestDepth());
colores = [fondo, fondo];
tipo = "linear";
alphas = [0, 100];
ratios = [0, 150];
matrix = {matrixType:"box", x:0, y:0, w:(original_mc._width), h:(original_mc._height), r:(90/180)*Math.PI};
spread = "pad";
interpolation   =
efecto_mc.beginGradientFill(tipo, colores, alphas, ratios, matrix, 'pad', 'linearRGB');
efecto_mc.moveTo(0,0);
efecto_mc.lineTo(original_mc._width,0);
efecto_mc.lineTo(original_mc._width,original_mc._height);
efecto_mc.lineTo(0,original_mc._height);
efecto_mc.lineTo(0,0);
efecto_mc.endFill();
efecto_mc._x = original_mc._x;
efecto_mc._y = original_mc._y + original_mc._height + 1;

Espero te sirva este codigo, cualquier comentario aqui te espero

hummm creo que podria convertir esto en un tuto si le meto algunas imagens

Gracias por responder a ambos.

LongeVie, tu idea es buena, y sé hacerla, pero prefiero con action para aplicarla a más clips.

NeoCesar da gusto gente como tú. Te agradezco mucho el tutorial que me acabas de hacer porque yo soy una persona que sabe programar en c, y necesito ver ejemplos asi de esta forma para empaparme de action. En serio, no te doy las gracias, te doy MIL GRACIAS. Lo he entendido a la perfección y me ha servido de mucho. Por cierto abajo, te dejo el código que hace falta para verla como un reflejo auténtico puesto que no había caído en que hay que escalar la imagen pal lado contrario ( no vale solo con rotarla. p.e. para que se vea la esquina inferior derecha del original reflejada en la esquina inferior derecha del reflejado, con tu codigo se veía en la esquina inferior izquierda, aunque de todas formas es lo que yo te pedí jejeje)

Una última cosa, con este ejemplo si colocaramos una imagen como fondo no valdría. como se podría hacer? ya se que es marear la perdiz jejej. O sea la cosa sería crear un degradado que en la parte superior dejara el movieclip tal como está y en la inferior fuera trasparente. Es imposible?

Saludos


El código para que se vea la imagen reflejada correctamente hay que insertarlo despues de esta linea:
reflejo_mc._y = original_mc._y + (2*original_mc._height) + 1;

Codigo a insertar :

Código :

reflejo_mc._xscale=-100;
reflejo_mc._x=reflejo_mc._x-original_mc._width;

buen dato por hacerlo rapido no habia caido en eso, y ya mande mi tuto para publicacion jajajaja, habra que comentarlo cuando sea publicado .

A tu pregunta de que pasa si colocamos una imagen como fondo, por desgracia no funcionaria y que yo sepa no hay un metodo para hacerlo, no se si lña version CS4 permitira mascaras degradas que seria una solucion rapida y flashcinante.