Hola nuevamente con ustedes amigos y amigas. En esta ocasión tengo para ustedes un tutorial mas el cual consta de un sensacional Efecto De Lupa, el efecto es algo simple y sencillo de realizar ya que este solamente consta de dos Clips De Película y en uno de los clips hacer una mascara, el cual servirá como efecto de lupa. También es necesario importar una Imagen a la biblioteca. ¿Comenzamos?.
Primero crear un documento de dimensiones que correspondan a la imagen a importar en esta ocasión el documento será de 499*337 píxeles de ancho y alto respectivamente. El color de fondo no importa ya que la imagen cubriara todo el espacio del documento.
Insertar un símbolo (ctrl. + F8), llamarlo imagen-real y de comportamiento Clip de película. Como ven estos dos pasos es de lo más sencillo de realizar.
Una vez en el símbolo importar (ctrl. + R) una imagen al escenario, después de esto colocar la imagen en coordenadas X = 0.0 y Y = 0.0.
En este paso crear un nuevo símbolo (ctrl. + F8) nombrarlo imagen-amplificada, y darle como comportamiento Clip de película.
Para que el trabajo salga de la mejor forma es necesario seguir al pie de la letra los siguientes pasos ya que las coordenadas como la amplificación de la imagen están fuertemente ligadas a la programación action scrip.
En el símbolo imagen-amplificada es prácticamente en donde se desarrollara el total del efecto. Comenzar por nombrar lupa a la capa y después diseñar la lupa que servirá como pantalla para hacer el trabajo de aumentar la imagen. Lo importante de este efecto es el tamaño del círculo, aquí se dibujo un círculo de tamaño 45 * 45 píxeles, y el total de ancho y alto de la lupa es de 68.8 * 69.2 colocar el diseño en coordenadas X = -44.0 y Y = -20.0.
Insertar una capa por debajo de la primera y nombrarla mascara, en esta capa dibujar un circulo de 45 * 45 píxeles, y colocarlo en coordenadas X = -20.0 y Y = -20.0. ya que este es el espacio que deja el diseño anterior.
Insertar una capa mas por debajo de las anteriores nombrarla imagen, y en ella arrastrar desde la biblioteca el símbolo imagen-real. Las coordenadas en las cuales quede la imagen no importan ya que en el siguiente paso se corregirán estas.
Aquí es necesario poner un nombre de instancia al Clip de película, el cual va hacer zoom. Hacer visible el panel de Transformar (ctrl. + T) y aumentar a 200 % la imagen después de lo anterior colocar la imagen en coordenadas X = 0.0 y Y = 0.0.
Seleccionar la imagen y abrir el panel de Acciones – Clip de película e insertar el siguiente código.
onClipEvent (enterFrame)
{
xmove = _root.cursor._x;
ymove = _root.cursor._y;
_x = (-3 – xmove) * 2
_y = (-3 – ymove) * 2
}
Por ultimo hacer clic en la capa mascara con ayuda del botón derecho del ratón, y luego seleccionar la opción Máscara para transformar la capa en máscara valga la rebusnancia.
Para concluir el tutorial regresar a la escena para hacer unos cuantos ajustes. Primero cambiar el nombre a la capa por el de real, después arrastrar desde la biblioteca el Clip de película imagen-real colocar el símbolo en coordenadas X = 0.0 y Y = 0.0.
Insertar un capa por encima (arriba), nombrarla lupa y en esta arrastrar desde la biblioteca el Clip de película imagen-amplificada, escribir como nombre de instancia cursor colocar el símbolo en coordenadas X = -44.0 y Y = -20.0.
Ahora seleccionar el fotograma de la capa lupa y abrir el panel de Acciones – Fotograma y luego escribir el siguiente código. Con esto se da por concluido el tutorial.
_root.onLoad = function() {
cursor.startDrag(true);
Mouse.hide();
};
P.D. Presionar ctrl. + enter para visualizar el efecto. Que tal Pura vida Verdad, si deseas publicar tutoriales flash en este espacio solamente hazlo saber. Nuevamente agradezco los comentarios y sugerencias.
Visualizar archivo swf de este tutorial
Descarga el archivo fla de este tutorial
Búsquedas:
- efecto lupa en flash
- efecto lupa flash
- lupa en flash
- lupa flash
- efecto lupa
- efecto de lupa en flash
- flash efecto lupa
- efecto lupa flash 8
- efecto lupa en flash 8
- efecto lupa con flash
Artículos relacionados:
- EFECTO ZOOM EN FLASH MX
- Efecto Reguilete Con Flash
- Efecto De Animación El Túnel Del Tiemo Con Flash CS3 (parte 1)
- Efecto de Galería Zoom con Flash 8 (segunda parte)
La verdad es sorprendente con el profesionalismo en que documentas muy facil de digerir y conste que ya le he intentado de aprender pero los tutoriales del programa para nada que se parecen a tu trabajo.
agradesco tu aportacion al aprendisaje
gracias por tus tutoriales, me han servido de guia.
ahora estoy haciendo uan revista y necesitaba cosas basicas y otras para darle un cache disntinto a las que hay
gracias
atte
Apulina
la raja!!!….te pasaste….hay tanto diseñador ..que no quiere mostrar lo que sabe por miedo…..que es elogiable la sencilles y grandeza de tus gesto…que se te agradece..
Muy buen tutorial enhorabuena, lo he utilizado para hacer un pequeño juego. Cuando lo tenga publicado te daré en agradecimiento y reconocimiento un enlace desde mi página.
Saludos avinagrados.
Vinagre Asesino.
Hola, por que solo funciona si esta en el primer frame? cuando lo cambio a otro frame no quiere funcionar…
gracias
Pregunta… como le agrego links???
como hago para poner este efecto en un clip de pelicula y no en una escena.
tengo flash 5 y no encuentro algunos pasos
No he podido raalizar las Acciones, algunas encontré otras me cansé buscándolas. Me pareció estupendo pero no lo conseguí.
Si realicé y le coloqué música al Tutorial del “Efecto Máscara al texto”en Flash”Fue simple y me encantó Gracias por todo
Fijaos en la fecha del aporte.
Igualmente más que la fecha, tienen que ver la versión en que está realizado el tutorial, y el idioma de Flash que utilicen. Teniendo en cuenta eso pueden adaptarlo, ya que si se puede realizar en cualquier versión de Flash.
Gracias Jorge por sus comentarios
Trabajo con el Flash Profesional 8 y en la UTN (Universidad Tecnológica Nacional) de Argentina, donde hicimos el curso, utilizan el MX…imposible verlo. De todos modos, lo hice video en mi camara y lo mostré desde allí. Quedó bonito!!!
Muy agradecida!!
muy buen efecto
Muy bueno compadrito te felicito ya te pedire algunos consejos ya que entre a este programa que es muy importante para crear páginas Web estoy entrando al moso script….felicidades
me manda errores en esto
onClipEvent (enterFrame)
{
xmove = _root.cursor._x;
ymove = _root.cursor._y;
_x = (-3 – xmove) * 2
_y = (-3 – ymove) * 2
}
no ma…… esta okas lo mejor es que compartes tu aprendizaje me lat sigue así… saludos
Al igual que la persona de arriba me manda errores en el codigo,que me hacen falta parentesis
me manda errores en esto
onClipEvent (enterFrame)
{
xmove = _root.cursor._x;
ymove = _root.cursor._y;
_x = (-3 – xmove) * 2
_y = (-3 – ymove) * 2
}
la verdad esta bueno tu tutorial, pero el primer codigo me okasiono lios no me permite hacer nada
= chido
onClipEvent (enterFrame)
{
xmove = _root.cursor._x;
ymove = _root.cursor._y;
_x = (-3 – xmove) * 2
_y = (-3 – ymove) * 2
}
see esto no me funsiona
me pasaba igual, porque hacia un copy-paste, si lo escriben, el problema se soluciona