Ver Mensaje Individual
  #2 (permalink)  
Antiguo 12/12/2010, 23:33
AlanChavez
 
Fecha de Ingreso: junio-2010
Ubicación: Charlotte, NC
Mensajes: 611
Antigüedad: 14 años, 6 meses
Puntos: 95
Respuesta: [Tutorial] Como programar un videojuego en Flash.

Código explicado
package {
es una directiva que siempre tenemos que utilizar al empezar a programar un archivo .as externo, nos permite incorporar toda una estructura jerarquica de clases al momento de programar en flash, pero son temas mas avanzados, de momento dejemoslo así.

Imports
Aqui es donde vamos a importar las librerías necesarias para manejar diferentes objetos en pantalla.
Utilizamos la librería geometríca rectangulo, porque vamos a definir un rectangulo en donde la olla se puede mover para atrapar los objetos.

La clase y su constructor.
public class juego extends flash.display.MovieClip {

En esta linea empezamos a definir una nueva clase, la palabra reservada "extends" quiere decir que "extiende" o "hereda" todos los métodos de la clase nativa "MovieClip", es decir que nuestra clase juego, al ser instanciada como un objeto, tendrá todos los métodos (y los que deseemos agregar) de la clase MovieClip, cada clase dependiendo de su comportamiento, puede extender o no, a otras clases nativas.

Este es el constructor del juego:
Código:
public function juego() {
			addEventListener(Event.ENTER_FRAME, cicloDelJuego);
			bg = new background();
			addChild(bg);
			estadoDeJuego = ESTADO_INICIAR;
		}
El constructor debe tener el mismo nombre de la clase. Es el método/función que se encarga de inicializar las variables de una clase. Al momento de instanciar la clase, es donde el programa empieza a ejecutarla.

En el constructor, estamos diciendole al programa que al momento en el que entre a un fotogramadel flash, va a ejecutar la funcion cicloDeJuego y va a pasar como argumento, el evento ENTER_FRAME

bg = new background();

recordemos, que cuando exportamos el movieclip del fondo de pantalla a ActionScript, lo exportamos con el nombre "background".
Lo que hizo flash, fue transformar ese MovieClip en una clase, y esta linea estamos instanciando la clase, convirtiendola en un objeto llamado bg que podremos manipular a nuestro gusto.

El método addChild, nos permite agregar dicho objeto ya instanciado, al escritorio de trabajo de flash.

Y finalmente inicializamos la variable de estado, al estado inicial.

Las variables
  • ESTADO_INICIAR,ESTADO_JUGAR,ESTADO_FIN. Son las variables de la máquina de estados que esta constantemente monitoreando el comportamiento del videojuego, dependiendo del estado en el que se encuentre el juego, es como se comportará el videojuego.
  • estadoDeJuego. Es la variable que se encuentra de almacenar el estado actual del videojuego. Si se encuentra activo, si esta por inicializarse, o si ya se alcanzó el final del juego.
  • vidaPerdidas. Define la cantidad de vidas que el jugador puede perder, antes de que la variable estadoDeJuego se cambie a ESTADO_FIN, que termina con la ejecución del juego.
  • ingredientesAtrapados. Lleva control de los ingredientes que han sido atrapados por la olla. La función que incrementa el nivel del juego, monitorea esta variable, para que en función de la misma, el nivel incremente.
  • bg, es una variable de tipo Movieclip que almacena la imagen de fondo del videojuego.
  • ingredientes. Es un arreglo, que almacena el indice de los diferentes ingredientes que se pueden agregar al videojuego.
  • ollaImagen. Una variable tipo Movieclip que almacena la imagen de la olla.
  • nivel. La variable que se encuentra de monitorear el nivel actual del videojuego.

Las funciones
  • cicloDeJuego(e:Event):void
    En este método, creamos nuestra máquina de estados. Es la función que se va a encargar de monitorear el estado actual del videojuego, y dependiendo del estado, entonces va a ejecutar una función.
  • incializarJuego()
    En éste método incializamos todo lo necesario para que nuestro juego empieze a funcionar.
    La linea:
    ollaImagen.startDrag(true,new Rectangle(0,272,422,0));

    Define un rectangulo, en la posición (0,272) de 422 pixeles de alto, y 0 alto, en la cual se puede mover la imagen (por eso el uso del metodo startDrag).

    Esta linea, restringe el movimiento de la olla, al eje de las X.
  • jugar()
    Esta función es la que ejecuta secuencialmente las instrucciones al juego.
  • crearIngredientes()
    Esta función, genera un número aleatorio entre 0 y 75. Verifica si ese número aleatorio es menor a 2 + nivel actual.
    Si la condición resulta ser positiva, va a instanciar la clase Ingredientes, que previamente habíamos exportado al ActionScript, y vamos a definir la variable velocidad, la cual va a aumentar conforme aumente el nivel del juego.
    Esta misma funcion genera otro número aleatorio, entre 1 y 5, para accesar a los diferentes ingredientes que tenemos en nuestro MovieClip.
    Definimos el punto de partida de donde van a empezar a salir los ingredientes, y despues, los dibujamos en pantalla, en una posicion aleatoria a lo largo de la pantalla.
  • tirarIngredientes()
    Es el método que se encarga de mover los ingredientes a lo largo de la pantalla. Conforme aumenta el nivel, mas rápido caen. Tambien verifica que si despues de que el ingrediente, salga de la pantalla, entonces lo va a remover del stack en la memoria, para no llegar a un overhead innecesario y repercutir en la ejecución del juego.
  • loAtrapo()
    Es el método que se encarga de monitorear las colisiones entre la olal y los ingredientes. Si existe una colisión el método elimina el ingrediente con el que se encuentra colisionando de la lista.
  • condicionParaPerder()
    Es el método que se encuentra monitoreando la variable de vidasPerdidas, en el momento en el que la variable de vidasPerdidas alcance el valor de 5. El método, cambia la variable de estado, a estado final.
  • terminarJuego()
    Es el metodo que se encarga de terminar la ejecución del juego.

Ejercicios
Modifica el código del juego de tal manera que:
  • Solo se permita atrapar un tipo de ingrediente.
  • Caigan Ingredientes de Bonus, de tal manera que al momento de atrapar dicho ingrediente, se le de una bonificación al jugador.
  • Cuando se pierda, se muestre el texto "Fin del Juego" en pantalla.
  • Las ingredientes que caigan, se encuentren animados.
  • Tener un texto, que muestre la puntuación.
Notas finales
Este no es el método mas efectivo, ni el recomendado para crear videojuegos. Si se trabaja en proyectos mas grandes, los videojuegos serán tardados de compilar, y sobretodo de mantener. crearía un archivo externo pesadísimo y muy díficil de trabajar en equipo, pero si proporciona un punto de inicio para el curioso programador que quiere aprender a programar videojuegos en Flash.

Elegí realizar el tutorial en Flash, debido a que Flash proporciona un ambiente de diseño, programación y animación en el mismo programa. No hay necesidad de instalar librerías gráficas externas, y el lenguaje de programación es facil de aprender y los métodos basicos para la programación de videojuegos, flash ya los tiene incrustados de manera nativa.

Espero les haya servido mi tutorial. Posteriormente escribiré uno acerca de como conectar un videojuego (o cualquier aplicación) a facebook y empezar a hacer un videojuego de distribución viral.

Estoy apenas realizando mi propia página web, en donde pondré este tutorial, y muchos mas, relacionado con la programación de videojuegos en diferentes lenguajes, primordialmente flash, php y c++

Cualquier comentario, respondan a este thread y les deseo que aprendan mucho. :)

Recuerden las imagenes no son mías, fueron obtenidas de IconFinder.com y de ToonBoom.com, los derechos son de sus respectivos autores y no deben usuarse con animos de lucro. Pueden usar este código libremente, sin necesidad de dar crédito.

Este tutorial tambien lo he publicado en otra página web, y lo publicaré en mi página personal, donde se encuentran hospedados los archivos.

http://alanchavez.com/2010/12/13/tut...-en-flash-as3/

Última edición por AlanChavez; 13/12/2010 a las 00:05