Efecto de luz y sombra con ángulo dinámico en Flash 8

Que tal gente de Cristalab. Después de beneficiarme de este foro durante muuucho tiempo, he decidido aportar alguna cosilla, así que he hecho este efecto en Flash, a ver si os gusta.

El tip siguiente se trata de crear un efecto de sombras dinámicas originadas por un foco de luz que sale del puntero del ratón. Lo bueno es que los objetos con sombras pueden ser cualquier tipo de elemento, hasta un campo de introducción de texto, como he puesto en el ejemplo siguiente:

Para esto, es necesario tener un MovieClip en el escenario con nombre "Foco", y este código en el primer frame:

Código :

function Orientacion(ObjetoRelativo:MovieClip):Number {
   // La posición del ratón relativa al objeto. 
   RatonX = ObjetoRelativo._xmouse - (ObjetoRelativo._width / 2);
   RatonY = ObjetoRelativo._ymouse - (ObjetoRelativo._height / 2);
   
   // Por trigonometría calculamos el ángulo
   Hipotenusa = Math.round(Math.sqrt(Math.pow(RatonX,2) + Math.pow(RatonY,2)));
   Angulo = Math.round(Math.asin(RatonY/Hipotenusa) * Math.round(180/Math.PI));
   
   // De esta forma se consigue que cubra los 360º
   if (RatonX < 0) {Angulo = 180 - Angulo}
   return Angulo;
}

function Distancia(ObjetoRelativo:MovieClip):Number {
   RatonX = ObjetoRelativo._xmouse - (ObjetoRelativo._width / 2);
   RatonY = ObjetoRelativo._ymouse - (ObjetoRelativo._height / 2);
   
   // Igual que la función orientación pero solo devuelve la hipotenusa
   // que es la distancia en cualquier dirección hasta el ratón.
   Hipotenusa = Math.round(Math.sqrt(Math.pow(RatonX,2) + Math.pow(RatonY,2)));
   return Hipotenusa;
}

function AplicaEfecto(ObjetoDestino:MovieClip) {
   // Los parámetros para la sombra.
   // Para que el efecto sea natural deben ser los mismos para todas las sombras.
   
   DistanciaSombra = 10;
   ColorSombra = 0x000000;
   TransparenciaSombra = 1;
   DesenfoqueX = 8;
   DesenfoqueY = 8;
   
   var FiltroTemporal = new flash.filters.DropShadowFilter((Distancia(ObjetoDestino)/DistanciaSombra), 180 + Orientacion(ObjetoDestino), ColorSombra, TransparenciaSombra, DesenfoqueX, DesenfoqueY);
   var Filtros:Array = ObjetoDestino.filters;
   Filtros.pop();
   Filtros.push(FiltroTemporal);
   ObjetoDestino.filters = Filtros;   
}

this.onEnterFrame = function() {
   // Por cada frame se aplica el efecto a todos los objetos que queramos.
   AplicaEfecto(texto1);
   AplicaEfecto(Perraco);
}

// Un efecto de foco MUUUYYY simple
startDrag(Foco,true);

Descarga el .fla del ejemplo.

Espero que os sea de ayuda.

 

Tweet