Dictado de cursos Nueva inscripción para curso “Flash Expert”
Nov 07

En este ejemplo, la idea es generar un par de funciones de suma utilidad, que van a tener como objetivo, hacer que una movieClip siga a la otra. Al mismo tiempo, se emplea una restricción en cuanto a la distancia mínima que debe existir entre las dos movies.
El ejemplo requiere que en el root, existan dos Movies, con una forma circular, lo lo mas cercana posible a un circulo. Una movie tiene que tener nombre de instancia “mc1″ y la otra “mc2″.
Por otro lado, al utilizar funciones, ustedes pueden llamarlas con las movies que deseen y en la cantidad que ustedes quieran.
Les dejo el SWF, y acontinuación todo el código fuente, comentado.

This movie requires Flash Player 8

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
factorReductor = 5;///Factor que determina la fuerza con la cual se acerca un objeto al otro 
this.onEnterFrame = function() { 
	mc1._x = _root._xmouse;///Una de las bolas sigue al mouse, en este caso en el eje X 
	mc1._y = _root._ymouse;///Una de las bolas sigue al mouse, en este caso en el eje Y 
	seguir(mc2,mc1,(mc1._width/2)+(mc2._width/2));///Llamo a la función que acerca una Movie a la otra, primer parametro: Mc a mover, segundo: Mc de destino, tercero: distancia minima permitida entre los objetos         
 
}; 
///Funcion que calcula la distancia entre dos puntos en un plano 
function distancia(p1x, p2x, p1y, p2y) { 
	return Math.sqrt(Math.pow(p1x-p2x, 2)+Math.pow(p1y-p2y, 2)); 
}         
 
///Funcion que realiza el acercamiento de una MC hacia otra 
function seguir(mc, destino, distanciaMinima) { 
	orig = {x:mc._x, y:mc._y};////Determino el punto determinado por la MC a mover 
	dest = {x:destino._x, y:destino._y};////Determino el punto que representa la MC de de destino 
	miAngulo = Math.atan2((orig.y-dest.y), (orig.x-dest.x));///Calculo el angulo entre dichos dos puntos 
	miDistancia = distancia(orig.x, dest.x, orig.y, dest.y)-distanciaMinima;////Calculo la distancia entre los dos puntos y le resto la distancia minima del tercer parametro 
	///Aca se controla si la MC a mover se acercò demasiado a destino, de no ser asi, la acerco utilizando trigonometria (coseno sobre X y seno sobre Y) 
	if (miDistancia+distanciaMinima>=distanciaMinima) { 
		mc._x -= Math.cos(miAngulo)*(miDistancia/factorReductor); 
		mc._y -= Math.sin(miAngulo)*(miDistancia/factorReductor); 
	} else { 
		//En caso de estar en suporposiciòn, alejo la bola del destino con la misma distancia, pero sin ningun factor reductor, lo que nos da un alejamiento inmediato 
		mc._x -= Math.cos(miAngulo)*(miDistancia); 
		mc._y -= Math.sin(miAngulo)*(miDistancia); 
	} 
}

Codigo Fuente (FLA) CS3: ejemplozip.zip

3 Responses to “Cómo hacer que una movie siga a otra a la distancia deseada.”

  1. Nicolás Says:

    Excelente aporte! Estos mini-tutoriales son realmente interesantes y además muy inspiradores a nivel diseño de interacción!

  2. Un poco mas sobre el seguimiento de MovieClips, ahora con restricciones Says:

    […] En este ejemplo vamos a tratar de ampliar el primer ejemplo, para lograr una interacción mas compleja. La idea es que las “bolas” no se superpongan unas con otras, ya que ahora hay mas de dos bolas, necesitamos chequear una por una contra la otra. Es un procedimiento bastante demandante de CPU, pero se logran buenos resultados rapidamente. Como es una continuación del primer ejemplo, recomiendo observar primero el mismo Ejemplo Anterior. Por otro lado, estamos usando una clase que contiene algunas funciones númericas necesarias que se crearon en otro ejemplo: Clase útil para funciones númericas […]

  3. Alejandro Quarto’s Source Code Compilation Says:

    […] The first example, is basicall a ball who follows another one. Is really simple and it works with a few lines of code. Main idea is to introduce constraints. LINK: http://alejandroquarto.com/2007/11/07/como-hacer-que-una-movie-siga-a-otra-a-la-distancia-deseada/ […]

Leave a Reply

You must be logged in to post a comment.

Todos los derechos reservados www.alejandroquarto.com queda prohibido la utilización de los contenidos en esta web para uso comercial.