martes, 24 de febrero de 2009

Exit 2 en LIVE Arcade

Exit fue uno de los poco juegos que realmente disfruté en mi mal lograda PSP (el pisa papeles más caro que he tenido), ahora, a partir del miercoles tendremos disponible su secuela en LIVE Arcade.

Mr.Esc ha de usar sus habilidades para rescatar a pobres e indefensos personajillos de morir bajo los devastadores efectos del fuego. Es un juego de habilidad que poco a poco te ira enganchando, así que te recomiendo como mínimo probar la demo.

Ficha del juego.

exit2

lunes, 23 de febrero de 2009

Ya soy MCP.

No me gusta mucho hablar sobre mí, y menos aquí, has venido a leer sobre XNA y lo último que quieres es ver auto bombo... pero que narices, me hace ilusión, y ¡además es mi blog!, así que por una entrada no creo qué pase nada ;)

Pues eso, que a partir de hoy soy MCP (Microsoft Certified Professional).

Saludos!!

mcp_logo

Farseer Physics Engine, un motor de físicas 2D para XNA

El otro día andaba yo navegando por la web de CodePlex, mirando a ver si había algo que me pudiese interesar en mis proyectos XNA.

Y vaya si lo encontré, Farseer Physics Engine es un motor de físicas 2D gratuito, tiene licencia Microsoft Permissive Licence (Ms-PL), lo que quiere decir que lo puedes usar en tus proyectos sin ningún problema (vamos, creo).

He estado trasteado con él un poco y pinta muy bien, personalmente yo lo voy a usar en mis juegos siempre que pueda, ya que ahorra bastante trabajo en algunas tareas, como las colisiones, rotaciones, las físicas (obvio no?) y los resultados son muy buenos.

interseccion

viernes, 20 de febrero de 2009

Nueva sección: Enlaces.

Hoy he creado esta nueva sección que creo puede ser de gran utilidad. En ella pretendo crear una buena colección de enlaces a páginas relacionadas con cualquiera de los temas tratados en este blog: videojuegos, programación o cualquier tema relacionado con la creación de videojuegos.

Poco a poco la iré haciendo crecer, y vuestras contribuciones serán bien recibidas.

Visitar la sección de enlaces.

jueves, 19 de febrero de 2009

Animar graficos en 2D

En el anterior capitulo aprendimos como cargar un gráfico en pantalla, pero estaremos de acuerdo que pocas veces veremos un gráfico en parntalla que no esté animado.

Creo que no le decrubo un secreto a nadie si digo que para animar un grafico en 2D hay que hacerlo fotograma a fotograma, hay que ir dibujando cada uno de los movimientos y luego irlos mostrando rápidamente uno detrás del otro para conseguir el efecto de movimiento.

Para conseguir esto en el mundo de los videojuegos en 2D lo que se hace es ir dibujando todos los movimientos de un personaje en un archivo gráfico, como comente el capitulo anterior puede ser un jpg, bmp, png, etc... (pero vuelvo a reiterar que los que me gusta usar a mi son los png, ya que permiten transparencias), para ver un ejemplo de lo que os digo fijaos en esta animación de Buu andando (estos recuerdos de infancia...)

buu



Podemos ver que en un mismo archivo gráfico están los cinco dibujos que conformarán la animación, ahora lo que hay que hacer es mostrar cada unos de estos dibujos uno tras otro para que como hemos comentado antes se produzca el efecto de movimiento, para ello lo que haremos será cargar el gráfico tal y como lo hicimos en el anterior tutorial pero esta vez en vez de mostrar el dibujo entero, solo mostraremos una parte de él e iremos iterando por el dibujo mostrando solo la parte que nos interese.

Para que te hagas una idea de lo que vamos a hacer imáginate que defines un rectángulo que vas a ir moviendo por el gráfico, y en pantalla solo mostraras lo que hay dentro de los limites de ese reactángulo, algo como esto:

buuanim

Una vez explicado esto, vamos a ver como lo hacemos:

Primero crea un proyecto nuevo, y haz doble clic en el fichero Game1.cs para poder ver y modificar su código.

Ahora hay que añadir al proyecto el gráfico que vamos a usar, para ello haz clic con el botón derecho en la carpeta Contenta y selecciona añadir > elemento existente y selecciona el gráfico que quieras cargar. Yo he usado el siguiente:

run

(Te preguntarás porque he usado un gráfico para escribir el tutorial y otro para picar el código, la respuesta es muy sencilla, empecé con el grafico de buu e hice el gif animado, luego cambie por este gráfico( que por cierto viene con el plataformer stated kid de XNA 3.0), y me da mucha pereza hacer el gif animado con este nuevo gráfico)

Lo primero de todo es crear las variables que usaremos:




[code language="csharp"]
//Grafico que se usará
Texture2D sprite;
//Para controlar el cambio de frame
float temporizador = 0f;
float intervalo = 1000f / 10f;
//Número de frames que tendrá la animación
int numFrames = 10;
int frameActual = 0;

//Tamaño del cada uno de los fotogramas (el rectángulo del ejemplo del tutorial)
int spriteAncho = 96;
int spriteAlto = 96;

Rectangle rectanguloOrigen;
Rectangle rectanguloDestino;
[/code]





Ahora vamos a cargar nuestro gráfico en el juego, en el método LoadContent agrega el siguiente código después del comentario:




[code language="csharp"]
sprite = Content.Load("Run");
rectanguloDestino = new Rectangle(0, 0, spriteAncho, spriteAlto);
[/code]





Lo siguiente que vamos a hacer es crear el código que hará que nuestro personaje se "anime", esto lo haremos en el método Update, que como sabemos es donde se actualiza la lógica del juego, agrega las siguientes líneas de código:



[code language="csharp"]
//Le sumamos al temporizador los milisegundos transcurruridos
temporizador += (float)gameTime.ElapsedGameTime.TotalMilliseconds;

//Si es mayor al tiempo que le hemos definido en el intervalo
if (temporizador > intervalo)
{
//Pasamos al siguiente frame
frameActual++;

//Controlamos que no nos pasemos de frames
if (frameActual > numFrames - 1)
{
frameActual = 0;
}
//Se pone el temporizador a cero
temporizador = 0f;
}

//definimos el rectángulo que mostrará el siguiente frame.
rectanguloOrigen = new Rectangle(this.frameActual * this.spriteAncho, 0, this.spriteAncho, this.spriteAlto);

base.Update(gameTime);[/code]




Y por último solo nos queda dibujar por pantalla, como siempre, en el método Draw:



[code language="csharp"]
GraphicsDevice.Clear(Color.CornflowerBlue);

spriteBatch.Begin();
spriteBatch.Draw(sprite, rectanguloDestino, rectanguloOrigen, Color.White);
spriteBatch.End();

base.Draw(gameTime);
[/code]




Descarga el proyecto con el código.

domingo, 15 de febrero de 2009

Cargar un gráfico en pantalla.

Ya hemos visto a la nave moviendose por la pantalla, ahora vamos a ir viendo paso a paso como crear nuestro juego usando XNA, luego podremos unir todos esos pasos, y tal vez, solo tal vez, nos quede algo bonito. Hoy vamos a ver como cargar un gráfico en pantalla para más adelante ir trabajando con él.

Es algo muy sencillo, lo primero es crear un proyecto nuevo, luego añadimos el gráfico en cuestión al proyecto, para eso vamos al explorador de soluciones y en la carpeta de proyecto "Content" clicamos con el botón derecho, en las opciones que aparecen seleccionamos añadir > archivo existente. Selecciona el fichero que quieras cargar en el juego.

[caption id="attachment_231" align="alignnone" width="411" caption="Añadir un archivo existente"]Añadir un archivo existente[/caption]

Podemos usar imagenes jpg, bmp, png... yo normalmente uso el formato .png por que es un formato que comprime bien, además le puedo poner transparencias.

Ahora ya tenemos el fichero listo para ser cargado, haz doble click en el fichero Game1.cs para poder ver y modificar su código. Crea una variable de tipo Texture2D, te ha de quedar algo así:
[code language="csharp"]
GraphicsDeviceManager graphics;
SpriteBatch spriteBatch;
Texture2D sprite;
[/code]

Ahora en el metodo LoadContent cargaremos el gráfico:
[code language="csharp"]
protected override void LoadContent()
{
// Create a new SpriteBatch, which can be used to draw textures.
spriteBatch = new SpriteBatch(GraphicsDevice);
//Cargamos el gráfico que hemos hañadido al proyecto, no es necesario poner la extensión del fichero
sprite = Content.Load("xnalogo");
}
[/code]

Por último en el metodo Draw le decimos que "pinte" el gráfico que hemos cargado en la pantalla:
[code language="csharp"]
protected override void Draw(GameTime gameTime)
{
GraphicsDevice.Clear(Color.CornflowerBlue);

spriteBatch.Begin();

spriteBatch.Draw(sprite, new Rectangle(0, 0, sprite.Width, sprite.Height), Color.White);

spriteBatch.End();

// TODO: Add your drawing code here

base.Draw(gameTime);
}
[/code]

Ahora ya puedes ejecutar el código y ver tú gráfico en la pantalla.

Descargar el proyecto con el código.

viernes, 13 de febrero de 2009

¡He vuelto a casa!

Después de mucho tiempo sin dar señales de vida, por fin vuelvo a retomar el blog.


Un pequeño problema técnico me ha tenido alejado de Internet durante un buen tiempo, vamos que se me jodido la placa base del portátil. Por fin he podido comprar uno nuevo y me he tirado una semana poniéndolo a punto, pero por fin tengo todo (o casi) instalado.


Estoy preparando unas pequeñas pruebas / tutoriales sobre XNA que pronto tendré acabadas y las podré ir publicando poco a poco.


Por otro lado he estado releyendo lo hecho hasta ahora y voy a hacer unos pequeños cambios en la estructura de los tutoriales sobre XNA, a partir de ahora en vez de ir construyendo un juego entero e ir explicando cómo hacer las cosas en base al código fuente del juego en sí, lo que hare es, como he comentado antes, pequeños proyectos con pruebas de concepto/tutoriales, ya que creo que así es más sencillo asumir los conocimientos, más adelante uniremos todos estos conocimientos y podremos crear un juego completo.


Y para ir abriendo boca un pequeño adelanto de los tutoriales que estoy preparando:


-          Trabajando con sprites (gráficos 2D)


o   Cargar un gráfico en pantalla.


o   Mover un sprite


o   Colisiones


o  


-          Sonido en XNA


o   Como preparar los ficheros de sonido para ser tratados en XNA


o   Usar sonidos en nuestro juego


o  


See you!