Comunidad de diseño web y desarrollo en internet online

mascaras y mouseEvent

Citar            
MensajeEscrito el 09 Nov 2010 06:31 pm
Hola a todos

Tengo el siguiente problema: tengo una máscara elíptica (que fue creada con un Shape) sobre una imagen que tiene unos listeners. Esto funciona tal como quiero, que es que al pasar sobre la imagen y sólo sobre la imagen que se alcanza a ver a traves de la máscara, ocurra un evento (en este caso manda un mensaje con trace) y lo mismo cuando salgo de la imagen. El código es el siguiente:


Código ActionScript :

//maskedClip es mi imagen que pase a MV, que voy a 
//enmascarar y maskingShape es la elipse
maskedClip.addEventListener(MouseEvent.MOUSE_OVER, overImage);
maskedClip.addEventListener(MouseEvent.MOUSE_OUT, outImage);

function overImage(evt:MouseEvent):void{
   trace("hola")
}
function outImage(evt:MouseEvent):void{
   trace("chau")
}

var clipWidth:Number=maskedClip.width;
var clipHeight:Number=maskedClip.height;

var maskingShape:Shape=new Shape(); 
this.addChild(maskingShape);

maskingShape.x=maskedClip.x;
maskingShape.y=maskedClip.y;

drawInMask();
maskedClip.mask=maskingShape;

function drawInMask():void {
   maskingShape.graphics.lineStyle();      
   maskingShape.graphics.beginFill(0xFFFFFF,1);
   maskingShape.graphics.drawEllipse(0,0,clipWidth,clipHeight);
   maskingShape.graphics.endFill();
}



Mi problema es que cuando quiero que la màscara sea algo que no es un Shape (como circulo o elipse), por ejemplo una imagen png, con la forma de una estrella por ejemplo, el listener funciona sobre toda la imagen que hace de máscara y no sólo sobre el pedacito que deja ver mi "masquedClip". El siguente código enmascara bien, pero no respeta el mouse event sobre la imagen visible solamente (o sea activa los listener sobre el cuadro de la imagen que enmascara y no sólo sobre la estrella).

Código ActionScript :

//donde maskedClip es la imagen a enmascar y maskingShape es 
//un MV hecho con un png que tiene transparencia
maskedClip.addEventListener(MouseEvent.MOUSE_OVER, overImage);
maskedClip.addEventListener(MouseEvent.MOUSE_OUT, outImage);

function overImage(evt:MouseEvent):void{
   trace("hola")
}
function outImage(evt:MouseEvent):void{
   trace("chau")
}

maskedClip.mask=maskingShape;
//para que funcione la màscara con la forma del dibujo se dejo "cacheAsBitmap = true" en ambos 
maskedClip.cacheAsBitmap = true;
maskingShape.cacheAsBitmap = true;



Gracias

Por CLAnonimo

Claber

600 de clabLevel

5 tutoriales
1 articulo

 

Este es un usuario anónimo genérico para las cuentas borradas o perdidas.

firefox
Citar            
MensajeEscrito el 15 Nov 2010 03:42 pm
Bueno, nadie me respondió, no sé si no se entendio la pregunta o si los que probaron el programa, dibujaron una estrella en lugar de colocar un png (con una imagen dibujada de una estrella o cualquier cosa en realidad), el programa funciona bien, o realmente este problema no tiene solución, aunque yo he visto aplicaciones que hacen lo que yo quiero implementar, pero no estoy segura si las máscaras serían una solución.
Cualquier recomendación o comentario, será bien recibido.
Gracias
Chao

Por CLAnonimo

Claber

600 de clabLevel

5 tutoriales
1 articulo

 

Este es un usuario anónimo genérico para las cuentas borradas o perdidas.

firefox

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.