Unidad 23. Animaciones avanzadas (II)

Ya tenemos nuestro código casi preparado, ahora sólo falta hacer que el proceso se repita un número determinado de veces. Esta película Flash sólo tiene un fotograma. ¿Cómo hacemos esto? Lo primero que se nos ocurre es incluir una instrucción while ... o una instrucción for ... , si lo hacemos veremos que no funcionará porque la repetición es tan rápida que no da tiempo a ver nada.

La solución está en introducir una instrucción que haga que el proceso se repita cada 35 milisegundos. Esto lo vamos a ver en el punto siguiente.

Hemos colocado un botón en la película de forma que cada vez que se pulsa, se detiene la ejecución (si todavía no había acabado) y se lanza una nueva ejecución.

Cuando el tope llega al suelo se detiene la ejecución.

btn_reproducir.addEventListener(MouseEvent.MOUSE_UP,playescena)

function playescena (event:MouseEvent):void {

  var baja:Boolean = true; //Si la bola sube o baja

  var incre_x:Number = 3.5; //Incremento vertical

  var incre_y:Number = 8; //Incremento horizontal

  var suelo:Number = 280; //Distancia ala que está el suelo

  var tope:Number = 0; //Altura máxima del bote

  var elasticidad:Number = 3; //Corrector del tope

  bola_mc.y = 0; //Comienza en la esquina superior izquierda

  bola_mc.x = 0;

  tope += (suelo - bola_mc.y) / elasticidad; //calculamos el tope

  var repeticion:Number;

  clearInterval(repeticion);

  repeticion = setInterval(botar, 35);//Repetimos botar cada 35 ms

  function botar() {

     if (baja) { // Si la bola baja...

        bola_mc.y += incre_y;//Aumentamos Y

        bola_mc.x += incre_x;

        if (bola_mc.y>=suelo) {

           baja = false; //Si ha llegado al suelo hacemos que suba

        }

     } else { // Si la bola sube...

        bola_mc.y -= incre_y;//Disminuímos Y

        bola_mc.x += incre_x;

        if (bola_mc.y<=tope) { //Cuando alcance el tope

            baja = true; //La hacemos bajar...

            if (tope>=suelo) { //Cuando el tope esté mas bajo que el suelo 

                incre_y = 0;   //Ya no rebota más

                clearInterval(repeticion);//Fin de la repetición

            } //Al llegar abajo, calculamos el nuevo tope

            tope += (suelo - bola_mc.y) / elasticidad;

         }

      }

   }

}

En este sencillo ejemplo la trayectoria de la bola es rectilínea, para que fuese un movimiento más real debería seguir una trayectoría curva. Dibujar curvas es un poco más complicado que dibujar rectas. Flash nos ofrece una opción más sencilla para hacer que un objeto siga una trayectoria curva: las guías de movimiento que veremos en este mismo tema aplicadas al bote de una pelota.

Y si queremos que quede perfecto, en vez de utilizar una velocidad constante, esta debería de depender de la altura, para que fuese decelerando al subir y acelerando al bajar.

Si deseas probar suerte con las curvas y ActionScript realiza el ejercicio paso a paso Movimiento en espiral para empezar a familiarizarte con ellas.

 Cursos Informática Gratuitos