Eh realizado grandes cambios en todo lo desarrollado

(si... lo dibuje yo la mayoria... al que no le gusta... que se pudra)

Ya esta creado un paquete con el EJEMPLO para descargar y probar.

Este paquete contiene:

1. sprites animados en SWF para el jugador
2. archivos PNG que serian el escenario improvisado para el juego
3. la nueva clase jugador
4. nueva clase: Fondo.As
5. el fla principal
6. 2 vectorizados para ser usados como limites horizontal y "piso"

Como funciona el juego ???

A diferencia de lo que enseñan en todas las paginas, estoy utilizando un sistema de cronometro (clase TIMER en AS3). Este cronometro realiza un ciclo de funciones cada X tiempo donde analiza todo el escenario y cada elemento incluyendo la captura de movimientos por teclado.

//primero inicializamos la clase TIMER que hara como un cronometro, realizando una accion cada 30 milisegundos

var timer:Timer = new Timer(30);

//luego agregamos la instancia al escenario principal donde se incluye la funcion que se ejecutara en el tiempo determinado

timer.addEventListener(TimerEvent.TIMER, ciclo);

//entonces la funcion CICLO se ejecuta cada 30 milisegundos

function ciclo(e:Event):void
{
        this.accion();
}

//ahora vemos que lo que hace la funcion ciclo, es una serie de subfunciones creadas dentro de ACCION. La razon de este encapsulamiento es por que mas adelante podemos crear una pausa dentro de CICLO o abrir y cerrar un menu u otras cosas que afecten la interfaz.

function accion():void
{
    this.jugador.rotar_sprites(this.xspeed,this.direccion,this.yspeed,this.cayendo);
    this.comprobar_piso();
    if (en_aire)
    {
        this.caer();
        this.jumping = false;
    }
    else
    {

        this.saltar();
    }
    this.corrector_vertical();
    comprobar_topes();
    this.mover_horizontal_jugador();
    centrar_jugador();
}

//ACCION sera la funcion encargada de:

1. cambiar los sprites del personaje dependiendo la accion
2. comprueba que el personaje este tocando el piso o este en el aire
3. aplica "gravedad" si el personaje no esta tocando el piso
4. corrige la posicion si al caer, pasa de largo verticalmente
5. comprueba si el jugador hace contacto lateral con los limites puestos en el terreno
6. centra el jugador, si este se sale del centro del escenario

Los movimientos del jugador ya fueron explicados, pero ahora cambiamos el movimiento horizontal para agregar una condicion nueva:

"si el personaje esta a medio escenario, el personaje realmente no avanza, sino que el fondo es el que se mueve a menos que el escenario llege a su limite... entonces el personaje se desplaza hasta encontrar un limite de contacto"

los limites horizontales, los limito por un dibujo vectorial llamado LIMITE ROJO, el cual es un dibujo vectorial.

(ESTO ES LO QUE NO SE VE al llegar al limite izquierdo del mapa... ya que cuando las cajas cumplen su cometido, hay que dejar su transparencia al minimo)

NO PUEDE SER UN JPG, PNG O BITMAP por que la funcion que se usa para consultar si hubo contacto funciona por puntos x,y (MOVIECLIP.HITTESTPOINT) dentro de un dibujo vectorial, no por raster.

De la misma forma se utiliza un contacto con el piso mediante un punto (dentro de la clase jugador) que hace contacto con PISO_CALLE.SWF

Hasta el momento esta completo el movimiento del personaje y el terreno. ahora falta la parte "bonita" del juego

Fondo 2D en movimiento

Tal como los juegos de SNES, vamos a simular profundidad de escenario cambiando las velocidades de las diferentes capas de sprite ( WTF ? )

El cielo es lo que esta mas lejos en el mapa. Por lo mismo no se mueve al mover el escenario (1).

Los cerros, estan mas cerca, por lo que se mueven(2)

Las casas del fondo, estan mas cerca que los cerros, asi que se mueven mas rapido(3).

La ultima capa (4) sera la que se mueve mas rapido ya que es la mas cercana.

Visto en forma general seria asi...

donde lo que vemos encerrado con rojo, es lo que realmente vemos y el resto simplemente se oculta a la vista del jugador.

Al movernos...

EL movimiento del escenario se invoca por "FONDO.MOVER( cantidad de pixels )"

y esos pixels son divididos dependiendo la profundidad del fondo.

this.mover_derecha = true;
this.terreno.x +=  cantidad;
this.contenedor_terreno.x +=  cantidad;
this.fondo_1.x +=  cantidad;
this.fondo_2.x +=  cantidad / 1.5;
this.fondo_3.x +=  cantidad / 3;
this.mover_izquierda = true;
this.contenedor_rojo.x +=  cantidad;

Por ejemplo: si muevo el fondo 30 pixels el cielo no se mueve, el fondo 1 se mueve 30 pixels en el eje X, fondo 2 se mueve 20pixels , fondo 3 se mueve 10 pixels.

La descarga de los archivos con todo el codigo, esta al inicio del articulo