Rebotando una pelota

Botando una pelota

El Escenario

• Si queréis seguir el mismo ejemplo que os pongo en el .fla, yo trabajé con un documento de 550 x 400 pixels, a 30 fps con fondo blanco
• Crearos una linea de horizonte, Yo utilicé un rectángulo de 125 px de alto
• La pelota es un círculo de 25 x 25 pixels con un degradado radial de blanco a negro (En vez de una pelota podéis usar un personaje del estilo de una rana, y queda bastante divertido)

La Pelota y el bote

• Lo primero es hacer el clip de la pelota. Seleccionamos nuestro dibujo, pulsamos F8 y creamos un símbolo de tipo gráfico al que llamamos pelota. Como centro de Transformación elegimos el Centro y Abajo.
• Una vez convertido en Símbolo volvemos a pulsar F8 y creamos un símbolo de tipo MovieClip también con el centro de transformación Abajo y al Centro.
  
  Es en este Movieclip donde vamos a Crear nuestra animación

1. En este MovieClip vamos a utilizar 3 capas como se muestra en la imagen. Una para la animación, una capa gúia y otra para la acciones.
   
   
2. Una vez hecha la animación de la pelota, tenéis que medir cuál ha sido exactamente el desplazamiento en el eje "x". En el caso de la animación del ejemplo es 67.5

Repitiendo el bote

• Si probáis la película, ya tendremos nuestro bote animado pero nos encontramos con dos pequeños problemas. El primero que la pelota bota sobre el mismo sitio, y el segundo que el primer y último fotograma se repiten. Para arreglar estos dos problemas metemos este código en el penúltimo fotograma:

gotoAndPlay(1);


this._x += 67.5;

• La primera línea de código hace que no se reproduza el último fotograma y así evitamos la superposición. La segunda incremente en "x" la cantidad de pixels que necesitamos para que la bota avance sin que se note un salto

Repitiendo el bote 2

• Para que la pelota vuelva por la izquierda cuando sale por la derecha yo he usado esto. Aunque aquí podemos usar muchísimos métodos distintos

if (this._x > 550){


	this._x = -25;


} 

• Y con esto hemos conseguido una animación completa en infinita con tan solo 15 frames y 4 líneas de código. Espero que os guste