jueves, 3 de septiembre de 2009

Diseña tus propios videojuegos para Windows, Zune y XBOX 360 con Microsoft XNA (Parte II)

 

Diseña tus propios videojuegos para Windows, Zune y XBOX 360 con Microsoft XNA (Parte I)

 

Buenas a todos, en el post de hoy vamos a continuar con la cadena de posts sobre Microsoft XNA, comenzando por donde lo dejamos el ultimo día, la instalación del producto.

Para instalar la plataforma completa deberemos tener dos ejecutables diferentes, el primero será el archivo que nos instalará el Visual Studio Express Edition, bien la versión 2005 ó bien la versión 2008 según la que nos hayamos descargado. El segundo será el instalador de XNA, donde se encuentran todas las librerías necesarias para la programación de videojuegos.

Hacemos doble clic en el primero de ellos, el Visual Studio, como veréis es un instalador normal, procederemos con la técnica del “siguiente, siguiente,…”, por lo que no nos vamos a entretener mas en explicarlo. Una vez instalado, instalaremos XNA desde su ejecutable de la misma manera.

Tras instalar ambos elementos, abrimos el Visual Studio:

image

Una vez abierto iremos a la pestaña “Archivo” y seleccionaremos “Nuevo proyecto”:

image

Deberíamos ver lo siguiente:

image

Ya tenemos todo preparado para empezar a programar nuestros videojuegos. Pero antes de tirarnos al rio, vamos a aprender jugando un poco. Como habréis visto en la imagen anterior, al instalarnos XNA, se nos ha instalado el código fuente de un videojuego que nos dan de ejemplo, al que han llamado “Platformer Starter Kit (3.1)”. Vamos a utilizar este código y generar el juego para practicar, para ello seleccionaremos el icono del muñeco que pone “Platformer Starter Kit (3.1)”, le daremos un nombre, una ubicación y aceptamos, deberíamos ver, el siguiente árbol de clases en el explorador de soluciones:

image

No os asustéis al verlo, aunque sea muy grande, es porque está el videojuego programado para las tres plataformas, es decir, es el mismo código, pero copiado tres veces para ejecutarse en Windows, en Xbox 360 y en Zune.

Si compilamos y ejecutamos el juego, pulsando F5, podremos jugar a nuestro primer juego hecho con XNA.

image

Tras haber jugado un poco con esta especie de “Indiana Jones” en 2D, vamos a pararnos un rato a estudiar el código. Cómo veréis, tenemos numerosas cosas, en primer lugar veremos 3 grandes bloques, uno con un icono de Windows, otro con un icono de Xbox 360 y otro con el icono de Zune, como es obvio y habréis intuido, es el mismo juego, pero programado para las tres plataformas diferentes. Si ahora nos centramos en el bloque del código de Windows, veremos numerosas clases diferentes, “enemy, animation, gem, player …”, pero ¿para qué queremos todas estas clases? Bien, cuando creemos un nuevo proyecto, se nos generará una única clase llamada “game”, donde contendrá todos los elementos necesarios para ejecutar el videojuego, pero por mantener un poco de orden y limpieza, y que cuando llevemos algunos cientos de líneas no nos comencemos a liar, está bien el utilizar una de las ventajas que nos ofrece C#, la orientación a objetos, y separar los elementos principales del juego en clases independientes, que iremos instanciando en la clase “game” según vayamos necesitando. Por ejemplo, podemos separar en clases independientes los movimientos que puede realizar el personaje principal del juego de los de otros personajes que salgan en el juego, sus texturas y variables, … Si no tenéis muy claro aún de que estamos hablando, cuando veamos algo de código volveremos sobre ello.

Por otro lado, además de las clases, veréis una sección en la que pone HighResolutionContent y otra que pone SharedContent, estas son las carpetas que contendrán las imágenes, fondos, músicas y demás elementos externos que utiliza el videojuego. Todos estos elementos externos como imágenes, sonidos, música de fondo… los almacenaremos en la carpeta “Content”, que se nos ha generado dentro de la carpeta raíz del proyecto, y luego podremos ir generando dentro de ella subcarpetas para organizar todo un poco.

Tras explicaros un poco a “groso modo” el contenido del videojuego de muestra, vamos a cerrarlo y a crear el proyecto de nuestro primer videojuego.

Al igual que antes vamos a la pestaña “Archivo” y seleccionamos “Nuevo proyecto”, se nos abrirán todas las plantillas que podemos seleccionar, de todos los elementos que salen a nosotros solo nos interesan tres de ellos:

  • Windows Game (3.1)
  • Xbox 360 Game (3.1)
  • Zune Game (3.1)

Para comenzar vamos a generar un “Windows Game”. Bien, ahora le damos un nombre, una ubicación y aceptamos.

image

Si os fijáis en el explorador de soluciones, ya no tenemos todas las clases que teníamos en el videojuego anterior, como os dije solo tenemos ahora una clase llamada Game1, donde deberemos programar todo el juego. Por otro lado tenemos otra clase llamada Program, que ignoraremos, ya que simplemente es la encargada de llamar a la clase Game1 para ejecutar el juego.

Para finalizar por hoy, vamos a abrir el código de la clase Game1.cs y estudiarlo un poco, para ello, podemos hacer doble clic sobre ella, se os abrirá la clase con el siguiente código que vamos a analizar por partes:

En primer lugar veremos todas las librerías que utiliza, si os fijáis la mayoría llaman a la biblioteca de Xna:

using System;

using System.Collections.Generic;

using System.Linq;

using Microsoft.Xna.Framework;

using Microsoft.Xna.Framework.Audio;

using Microsoft.Xna.Framework.Content;

using Microsoft.Xna.Framework.GamerServices;

using Microsoft.Xna.Framework.Graphics;

using Microsoft.Xna.Framework.Input;

using Microsoft.Xna.Framework.Media;

using Microsoft.Xna.Framework.Net;

using Microsoft.Xna.Framework.Storage;

Avanzando un poco llegamos a una serie de funciones, de las cuales nos centraremos únicamente en cuatro de ellas, ya que serán las únicas que debemos tocar a la hora de programar el juego.

La primera de las cuatro funciones que aparecen es la función Initialize, esta función se ejecuta únicamente cuando se inicia el videojuego, así que la aprovecharemos para inicializar variables, inicializar las texturas de los personajes e inicializar el tamaño de pantalla del videojuego:

protected override void Initialize()

{

// TODO: Add your initialization logic here

base.Initialize();

}

La siguiente función, LoadContent, la utilizaremos para cargar las imágenes (que almacenaremos en la carpeta “Content”) que representaran las texturas del juego y los sonidos y demás elementos externos que requiramos en el videojuego:

protected override void LoadContent()

{

// Create a new SpriteBatch, which can be used to draw textures.

spriteBatch = new SpriteBatch(GraphicsDevice);

// TODO: use this.Content to load your game content here

}

Las dos funciones anteriores, Initialize y LoadContent se ejecutarán únicamente al principio del juego. Ahora vamos a explicar las siguiente funciones que se ejecutaran de manera infinita hasta que el juego finalice, es decir, en un bucle cuya función de salida es cerrar el videojuego.

En la función Update deberemos programar las acciones que determinen las modificaciones en el juego, es decir, por ejemplo, si el personaje principal, se mueve hasta la mitad de la pantalla y hay una piedra, que no pueda avanzar más, o por poner otro ejemplo, si estamos programando un juego de coches, si el jugador pulsa la tecla flecha izquierda, haremos que el coche gire a la izquierda:

protected override void Update(GameTime gameTime)

{

// Allows the game to exit

if (GamePad.GetState(PlayerIndex.One).Buttons.Back == ButtonState.Pressed)

this.Exit();

// TODO: Add your update logic here

base.Update(gameTime);

}

Finalmente nos encontraremos con la function Draw, que se ejecutará después de la función Update, y será la encargada de dibujar todos los elementos en pantalla, por tanto, si se ha producido un cambio en el juego en la función Update, cambiaremos los objetos de pantalla para reproducir ese cambio en la función draw. Por continuar el ejemplo, si tenemos el coche en el centro de la pantalla, y en la función Update detectamos que el jugador a pulsado la tecla izquierda, y hemos indicado al coche, que gire a la izquierda unos pixels, dibujaremos el coche en esta iteración del bucle general unos pixels mas a la izquierda, para visualizar la acción que ha ejercido el jugador sobre el teclado en la pantalla:

protected override void Draw(GameTime gameTime)

{

GraphicsDevice.Clear(Color.CornflowerBlue);

// TODO: Add your drawing code here

base.Draw(gameTime);

}

Con todo esto, tenéis para practicar durante los próximos días, hoy ya hemos visto un código terminado, es más sencillo de lo que parece a primera vista, y como habéis visto en el videojuego que estamos programando desde cero, las funciones para las que debemos generar el código se resumen en cuatro muy sencillas de entender y que tienen una finalidad muy delimitada, lo que las simplifica enormemente.

El próximo día rellenaremos estas cuatro funciones para generar nuestro primer juego, en él, añadiremos un muñeco que se mueva por la pantalla, un ejemplo sencillo y muy ilustrativo, por si queréis ir preparándolo, necesitaremos un fondo como el que habéis visto en el videojuego “Platformer Starter Kit (3.1)”, y dos imágenes de un muñeco mirando hacia ambos lados.

Un saludo y espero estéis disfrutando del manual!!

No hay comentarios: