Comunidad de diseño web y desarrollo en internet online

Efecto zoom en flash

Citar            
MensajeEscrito el 23 Oct 2008 09:25 pm
HOLA QUE TAL. :D

Bueno les planteo mi problema espero me pueden hechar una manilla.

Bueno lo que pasa es que quiero hacer un efecto de tipo camara en flash, es decir que se acerque a la imagen, y pues de hay partir a otra.

Bueno les agradesco mucho, y les mando saludos gracias.

:lol:

Por MENBORRE

3 de clabLevel



 

msie
Citar            
MensajeEscrito el 23 Oct 2008 10:23 pm
Explica que deseas hacer, segun entiendo son transiciones entre imágenes pero que estas sean con un zoom de la imagen. Es esto?

Por elchininet

Claber

3921 de clabLevel

17 tutoriales

Genero:Masculino  

Front-end developer at Booking.com

firefox
Citar            
MensajeEscrito el 24 Oct 2008 02:51 pm

elchininet escribió:

Explica que deseas hacer, segun entiendo son transiciones entre imágenes pero que estas sean con un zoom de la imagen. Es esto?
Hola que tal.

:lol:
Perdon por no especificar bien, es que como apenas me inicio en flash no se como llamarle pero a continuacion pongo un ejemplo:

Un avion que se vea de lejos, luego que se valla hacercando poco a poco hasta llegar a la ventanilla del avion y de hay poner una imagen del entorno del avion pero por dentro, no se si me doy a entender??

Bueno espero me haya podido explicar, para que me hechen una manilla porfavor.

Gracias

:D

Por MENBORRE

3 de clabLevel



 

msie
Citar            
MensajeEscrito el 24 Oct 2008 03:01 pm
Normalmente debes tener imágenes a grandes dimensiones para esto y lo que deberías hacer es poner la ventanilla del avión transparente y que deje ver lo que hay detrás que sería la imagen de la parte de adentro (en la misma perspectiva), cuando el orificio de la ventanilla cubra toda la pantalla puedes a partir de ahí continuar con la imagen de la parte de adentro.

Por elchininet

Claber

3921 de clabLevel

17 tutoriales

Genero:Masculino  

Front-end developer at Booking.com

firefox
Citar            
MensajeEscrito el 24 Oct 2008 08:15 pm
yo tengo el mismo problema!

estoy intentando hacer un escenario, que es una fachada de una casa, cuando hago click en un botón mediante transitions tween _xscale e _yscale se acerca a una ventana y se vé el interior de una habitación donde transcurren una serie de acontecimientos.

mi problema viene con las variables y los botones de mi escenario, me explico

tengo 4 botones

y quiero que cada uno de ellos haga un movimiento en mi clip

el boton 1 entra haciendo un recorrido a una habitación y cuando le doy a cualquiera de los otros tres botones, el recorrido que hace es a la inversa y posteriormente con un onMotionFinished hace otro zoom a otra ventana....


no sé si me explico....


lo que necesito, es saber el código de la variable que tengo que utilizar para que,esté en la habitación que esté, haga el movimiento inverso que ha hecho antes y se dirija a donde yo kiero....

la programación de variar la x y la y tanto el tamaño _xscale e _yscale ya la tengo.


espero que alguien me pueda ayudar, es muy importante!


muchisimas gracias de antemano.

Por vegadesign

20 de clabLevel



 

firefox
Citar            
MensajeEscrito el 24 Oct 2008 08:40 pm
Al parecer lo que necesitas es el método yoyo(). Acán en clab a unos muy buenos tips sobre la clase tween

Por The Fricky!

Presidente

6168 de clabLevel

3 tutoriales
8 articulos

Genero:Masculino   Bastard Operators From Hell Héroes

Piccola Venezia...

firefox
Citar            
MensajeEscrito el 25 Oct 2008 11:58 am
muchas gracias!

voy a intentarlo.....a ver si me sale.

Por vegadesign

20 de clabLevel



 

firefox
Citar            
MensajeEscrito el 25 Oct 2008 01:45 pm
creo que el método yoyo() no me vale para lo que estoy haciendo... porque tengo 4 botones y dependiendo de qué movimiento haya hecho antes el clip, tiene que reconocer ese movimiento y hacer otro...
no sé si me explico correctamente....

Por vegadesign

20 de clabLevel



 

firefox
Citar            
MensajeEscrito el 25 Oct 2008 04:32 pm
Bueno entonces utiliza otra función que describa el mismo movimiento pero a la inversa, te recomiendo mejor utilizar otra librería de Tween como TweenMax o Caurina.

Revisa el test de velocidad de las principales librerías de Tweens para que hagas una comparación.

Por elchininet

Claber

3921 de clabLevel

17 tutoriales

Genero:Masculino  

Front-end developer at Booking.com

firefox
Citar            
MensajeEscrito el 25 Oct 2008 07:07 pm
ya me he descargado la libreria tweenMax, muchas gracias!!!

pero mi problema, esque no sé que código tengo que utilizar para asignarle a cada boton de mi escenario para que dependiendo de qué movimiento haya hecho mi movieclip haga ese movimiento a la inversa.

explico mejor:


imaginaros que somos una cámara..... estamos en una home y tenemos boton1, boton2, boton3 y botón4 y tenemos 4 escenarios....los 4 botones están fijos en mi home y cada uno de ellos al pulsarlos me lleva a un escenario(que no es más, que un movieclip que varía en x e y y también en _xscale e _yscale)


pulsamos boton1 y mediante zoom nos lleva a escenario 1 (aki está mi problema) si pulso a boton2 o boton3 o boton4 me tiene que llevar a escenario2 o escenario3 o escenario4 haciendo antes el zoom a la inversa.

(no sé si necesito variables....yoyo() , estoy perdidisima) alguien me podría poner un ejemplo super sencillo de lo que os estoy comentando?


muchas gracias

Por vegadesign

20 de clabLevel



 

firefox
Citar            
MensajeEscrito el 26 Oct 2008 12:03 pm
Una preguntilla..... he encontrado ésto...y puede que sea lo que necesito


//importas la cllase y sus suavizados
import mx.transitions.Tween;
import mx.transitions.easing.*;
//
//cantidad de botones
var cantBtns:Number = 10;
//con for programamos todos los botones de una vez
for(var i:Number = 1; i <= cantBtns; i++){
var myMovieClip:MovieClip = this["mc"+i];
this["boton_"+i].onRelease = function(){
var miTween:Tween = new Tween(myMovieClip, "_alpha", Back.easeOut, 0, 100, 1, true);
}
this["boton_"+i].miTween.onMotionFinished(){
fadeOut();
}
}
function fadeOut(){
for(var j:Number = 1; j<= cantBtns; j++){
var miTween2:Tween = new Tween(this["mc"+j], "_alpha", Back.easeOut, 100, 0, 1, true);
}
}

este es el código de éste caso....



Tengo una película con varios botones (botón A, botón B...). Cuando pincho en un botón se me ejecuta un movieclip (botón A ejecuta movieclip A) que consiste en la aparición desde alfa 0% a 100% de unas imágenes y un texto.

El problema en sí, es que cuando pincho en otro botón (botón B) quiero que el movieclip A desaparezca mediante una transición suave de 100 a 0 y no de repente, como me sucede ahora mismo, y después cargue el movieclip B correspondiente.

Con un par de botones, tengo la solución por la cuenta de la vieja, pero mi problema es que son 10 botones.

Me han dado esta solución (difícil de entender para mí):

1) Se hará jugando con 2 variables:
_root.seccion_actual
_root.seccion_a_cargar

2) Hacemos una animación de "descarga" para cada sección (las marcamos con un nombre de frame por ejemplo "salida_filosofia", "salida_compromiso", etc...).
En el frame final de la animación de salida le diremos que nos cargue la nueva sección. Esto dependiendo de si se carga un movieclip o se envía a un frame. Para ello usamos la variable _root.seccion_a_cargar

3) Cada vez que se entra en un apartado tenemos que guardar en la variable _root.seccion_actual el nombre del movieclip (o frame) de cada apartado, para saber después que animación de salida tenemos que cargar:
var _root.seccion_actual = "movieclip_filosofia";

4) En los botones del menú de secciones, cuando clickamos una sección, tenemos que decirle cual va a ser la sección que se va a cargar y cual es la sección que va a hacer la animación de salida.
Vendría a ser algo así:
on(release){
_root.seccion_a_cargar = "esta seccion"; // definimos la sección a la que queremos cambiar
_root[_root.seccion_actual].gotoAndPlay("salida_"+_root.seccion_actual); //cargamos la animación de salida de la sección donde estamos
}

Al hacer las instrucciones variará dependiendo de si el flash es un solo movieclip o si son varios, pero se juega con las 2 variables exactamente igual en ambos casos.






la diferencia es que en vez de alpha y cargar otro mivieclip.....yo necesito mover siempre el mismo movie clip en x, y x_scale e _yscale, y que yo solo tengo 4 botones.....


alguien me puede ayudar?

Por vegadesign

20 de clabLevel



 

firefox
Citar            
MensajeEscrito el 26 Oct 2008 02:53 pm
@vegadesign, esto que posteas no te ayudará, ya que cada botón lo que hace es hacer una animación y desvanecer después el clip cuando esta finalice, te doy un consejo, primero crea tus botones y haz que se animen utilizando TweenMax, de ser posible que los botones llamen a una función que por medio de parámetros haga la transición, después postea el código y trataremos de llegar a una solución factible para ti.

Por elchininet

Claber

3921 de clabLevel

17 tutoriales

Genero:Masculino  

Front-end developer at Booking.com

firefox
Citar            
MensajeEscrito el 26 Oct 2008 03:24 pm
vale!! muchisimas gracias!


voy a hacer un ejemplo muy básico de lo que necesito a ver si podemos solucionar esto que me tiene loca!

Por vegadesign

20 de clabLevel



 

firefox
Citar            
MensajeEscrito el 26 Oct 2008 04:17 pm
cuelgo un fla por si alguien puede echarle un vistazo...



solo está la programación en los dos primeros botones...eso es lo que quiero que me haga cada uno de ellos (pero si el mc está en unas determinadas dimensiones...(dependiendo del botón que hemos pulsado antes....)tiene que hacer el recorrido a la inversa......


vegadesign.site88.net/prueba/prueba_zoom.fla



espero que alguien me pueda ayudar....yo sé que el método que estoy utilizando no es el adecuado...solo quiero que alguien me diga que es lo que tengo que hacer.


gracias!!!

Por vegadesign

20 de clabLevel



 

firefox
Citar            
MensajeEscrito el 26 Oct 2008 05:44 pm
No postees el fla, postea el código que utilizas.

Por elchininet

Claber

3921 de clabLevel

17 tutoriales

Genero:Masculino  

Front-end developer at Booking.com

firefox
Citar            
MensajeEscrito el 26 Oct 2008 08:05 pm
lo hacía simplemente para que os ayudara un poco mejor a entender lo que necesito



este es el código:




import mx.transitions.Tween;
import mx.transitions.easing.*;


b1.onRelease = function() {

b1.enabled = false;
b2.enabled = true;


var cero = new mx.transitions.Tween(miclip, "_xscale", mx.transitions.easing.Regular.easeInOut, miclip._xscale, 100, 1, true);
new mx.transitions.Tween(miclip, "_yscale", mx.transitions.easing.Regular.easeInOut, miclip._yscale, 100, 1, true);
new mx.transitions.Tween(miclip, "_y", mx.transitions.easing.Regular.easeInOut, miclip._y,158.0, 1, true);
new mx.transitions.Tween(miclip, "_x", mx.transitions.easing.Regular.easeInOut, miclip._x, 259.9, 1, true);

cero.onMotionFinished = function() {

var uno = new mx.transitions.Tween(miclip, "_xscale", mx.transitions.easing.Regular.easeInOut, miclip._xscale, 790, 1, true);
new mx.transitions.Tween(miclip, "_yscale", mx.transitions.easing.Regular.easeInOut, miclip._yscale, 790, 1, true);
new mx.transitions.Tween(miclip, "_y", mx.transitions.easing.Regular.easeInOut, miclip._y, 900, 1, true);
new mx.transitions.Tween(miclip, "_x", mx.transitions.easing.Regular.easeInOut, miclip._x, 1300, 1, true);

uno.onMotionFinished = function() {
new mx.transitions.Tween(miclip, "_y", mx.transitions.easing.Regular.easeInOut, miclip._y, 910, 1, true);
new mx.transitions.Tween(miclip, "_x", mx.transitions.easing.Regular.easeInOut, miclip._x, 1350, 1, true);
};
};
};


b2.onRelease = function() {
b1.enabled = true;
b2.enabled = false;
var dos = new mx.transitions.Tween(miclip, "_xscale", mx.transitions.easing.Regular.easeInOut, miclip._xscale, 100, 1, true);
new mx.transitions.Tween(miclip, "_yscale", mx.transitions.easing.Regular.easeInOut, miclip._yscale, 100, 1, true);
new mx.transitions.Tween(miclip, "_y", mx.transitions.easing.Regular.easeInOut, miclip._y, 158.0, 1, true);
new mx.transitions.Tween(miclip, "_x", mx.transitions.easing.Regular.easeInOut, miclip._x, 259.9, 1, true);

dos.onMotionFinished = function() {
var tres = new mx.transitions.Tween(miclip, "_xscale", mx.transitions.easing.Regular.easeInOut, miclip._xscale, 790, 1, true);
new mx.transitions.Tween(miclip, "_yscale", mx.transitions.easing.Regular.easeInOut, miclip._yscale, 790, 1, true);
new mx.transitions.Tween(miclip, "_y", mx.transitions.easing.Regular.easeInOut, miclip._y,900, 1, true);
new mx.transitions.Tween(miclip, "_x", mx.transitions.easing.Regular.easeInOut, miclip._x, 600, 1, true);


tres.onMotionFinished = function() {

new mx.transitions.Tween(miclip, "_y", mx.transitions.easing.Regular.easeInOut, miclip._y, 910, 1, true);
new mx.transitions.Tween(miclip, "_x", mx.transitions.easing.Regular.easeInOut, miclip._x, 650, 1, true);
};
};
};

Por vegadesign

20 de clabLevel



 

firefox
Citar            
MensajeEscrito el 27 Oct 2008 08:58 am
Al final decidiste utilizar los Tween de Adobe a TweenMax, bueno no hay problema, mucho más trabajo y menos optimización, pero es tu desición.

Postea los códigos entre tags de ActionScript para que se puedan leer:

Código :

[as]
//---Tus códigos aquí
[/as]

Por elchininet

Claber

3921 de clabLevel

17 tutoriales

Genero:Masculino  

Front-end developer at Booking.com

firefox
Citar            
MensajeEscrito el 27 Oct 2008 10:05 am

Código ActionScript :

import mx.transitions.Tween;
import mx.transitions.easing.*;


b1.onRelease = function() {

b1.enabled = false;
b2.enabled = true;


var cero = new mx.transitions.Tween(miclip, "_xscale", mx.transitions.easing.Regular.easeInOut, miclip._xscale, 100, 1, true);
new mx.transitions.Tween(miclip, "_yscale", mx.transitions.easing.Regular.easeInOut, miclip._yscale, 100, 1, true);
new mx.transitions.Tween(miclip, "_y", mx.transitions.easing.Regular.easeInOut, miclip._y,158.0, 1, true);
new mx.transitions.Tween(miclip, "_x", mx.transitions.easing.Regular.easeInOut, miclip._x, 259.9, 1, true);

cero.onMotionFinished = function() {

var uno = new mx.transitions.Tween(miclip, "_xscale", mx.transitions.easing.Regular.easeInOut, miclip._xscale, 790, 1, true);
new mx.transitions.Tween(miclip, "_yscale", mx.transitions.easing.Regular.easeInOut, miclip._yscale, 790, 1, true);
new mx.transitions.Tween(miclip, "_y", mx.transitions.easing.Regular.easeInOut, miclip._y, 900, 1, true);
new mx.transitions.Tween(miclip, "_x", mx.transitions.easing.Regular.easeInOut, miclip._x, 1300, 1, true);

uno.onMotionFinished = function() {
new mx.transitions.Tween(miclip, "_y", mx.transitions.easing.Regular.easeInOut, miclip._y, 910, 1, true);
new mx.transitions.Tween(miclip, "_x", mx.transitions.easing.Regular.easeInOut, miclip._x, 1350, 1, true);
};
};
};


b2.onRelease = function() {
b1.enabled = true;
b2.enabled = false;
var dos = new mx.transitions.Tween(miclip, "_xscale", mx.transitions.easing.Regular.easeInOut, miclip._xscale, 100, 1, true);
new mx.transitions.Tween(miclip, "_yscale", mx.transitions.easing.Regular.easeInOut, miclip._yscale, 100, 1, true);
new mx.transitions.Tween(miclip, "_y", mx.transitions.easing.Regular.easeInOut, miclip._y, 158.0, 1, true);
new mx.transitions.Tween(miclip, "_x", mx.transitions.easing.Regular.easeInOut, miclip._x, 259.9, 1, true);

dos.onMotionFinished = function() {
var tres = new mx.transitions.Tween(miclip, "_xscale", mx.transitions.easing.Regular.easeInOut, miclip._xscale, 790, 1, true);
new mx.transitions.Tween(miclip, "_yscale", mx.transitions.easing.Regular.easeInOut, miclip._yscale, 790, 1, true);
new mx.transitions.Tween(miclip, "_y", mx.transitions.easing.Regular.easeInOut, miclip._y,900, 1, true);
new mx.transitions.Tween(miclip, "_x", mx.transitions.easing.Regular.easeInOut, miclip._x, 600, 1, true);


tres.onMotionFinished = function() {

new mx.transitions.Tween(miclip, "_y", mx.transitions.easing.Regular.easeInOut, miclip._y, 910, 1, true);
new mx.transitions.Tween(miclip, "_x", mx.transitions.easing.Regular.easeInOut, miclip._x, 650, 1, true);
};
};
};

Por vegadesign

20 de clabLevel



 

firefox
Citar            
MensajeEscrito el 27 Oct 2008 01:39 pm
muchas gracias por tu atención elchininet pero al final creo que voy a optar por hacerlo de otra forma


Un saludo! y muchas gracias

Por vegadesign

20 de clabLevel



 

firefox
Citar            
MensajeEscrito el 27 Oct 2008 02:06 pm
Vale, no hay de que ;)

Por elchininet

Claber

3921 de clabLevel

17 tutoriales

Genero:Masculino  

Front-end developer at Booking.com

firefox
Citar            
MensajeEscrito el 18 Ago 2009 03:34 pm
he estado buscando un tutorial que me pueda enseñar a hacer un transicion con zoom, un gran ejemplo es el google map que te permite hacer un recorrido hacia otra fotografia, como logro hacer ese zoom, hay me podria ayudar o saber algun codigo? nose mucho programacion solo me defiendo pero he logrado y he aprendido muchas cosas y la verdad ke me sirve mucho saber esto.
saludos..

Por joshmaster

11 de clabLevel



 

firefox

 

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