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.”
Leave a Reply
You must be logged in to post a comment.

November 8th, 2007 at 11:11 am
Excelente aporte! Estos mini-tutoriales son realmente interesantes y además muy inspiradores a nivel diseño de interacción!
November 11th, 2007 at 11:50 pm
[…] 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 […]
December 7th, 2007 at 7:45 pm
[…] 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/ […]