Xna tutorial » 2D http://www.xna-tutorial.com Otro blog más de WordPress Tue, 26 Apr 2011 20:35:53 +0000 http://wordpress.org/?v=2.8.4 en hourly 1 Tutorial [Entrega 5]: Añadiendo disparos de los enemigos http://www.xna-tutorial.com/tutorial-entrega-5-aadiendo-disparos-de-los-enemigos/ http://www.xna-tutorial.com/tutorial-entrega-5-aadiendo-disparos-de-los-enemigos/#comments Wed, 23 Dec 2009 12:40:00 +0000 rantamplan http://www.xna-tutorial.com/tutorial-entrega-5-aadiendo-disparos-de-los-enemigos/ Llegados a este punto, tenemos nuestra nave frente a unas cuantas naves enemigas. Nuestra nave puede disparar y eliminar a los enemigos, pero los enemigos todavía no pueden dispara para intentar eliminarnos. Vamos a ver como podemos hacer esto después del salto.

 

Como ya sabéis, si tenéis alguna duda, podéis plantearla en el foro: http://www.foro.xna-tutorial.com/viewtopic.php?f=4&p=8#p8

 

Añadir los disparos de los enemigos, dado el código que tenemos ya escrito en anteriores entregas del tutorial, va a ser realmente fácil.

Veamos los cambios que debemos introducir según las clases.

 

Clase “Enemigo”

Lógicamente, esta será la clase que debemos modificar. Lo que haremos será principalmente generar un numero aleatorio, el cual nos indicará si el enemigo debe disparar o no debe disparar. Manos a la obra.

Primero nos definiremos dos nuevos atributos:

  1         static Random rand = new Random();
  2         public int probabilidadDisparo = 2;

 

El número 2 de “probabilidadDisparo”  es la cota que indica si debe disparar o no. Si subimos ese número, los enemigos dispararan más a menudo. De esta forma podemos aumentar el nivel de dificultad (la cadencia de disparos enemigos) simplemente incrementando ese valor.

 

Ahora vamos al método “Actualizar()”, y le añadimos lo siguiente:

  1         public void actualiza()
  2         {
  3
  4             if (disp == null)
  5             {
  6                 if (rand.Next(1000) < probabilidadDisparo)
  7                     disparar();
  8             }
  9             else
10             {
11                 disp.actualiza();
12             }
13            
14         }

 

Esto lo que hará será obtener un nuevo numero aleatorio, y si ese numero es menor que la cota de “probabilidadDisparo” entonces disparará. Esto solo lo hará si el enemigo no ha disparado (recordemos que cada nave solo puede tener un disparo al mismo tiempo). Si ya había disparado, entonces actualizaremos el disparo.

 

 

Clase “Nave”

En esta clase vamos a definir una propiedad que nos devuelva el rectángulo que envuelve a la nave para poder comprobar las colisiones. Es un cambio menor.

  1         public Rectangle Rectangulo
  2         {
  3             get { return new Rectangle((int)pos.X, (int)pos.Y, textura.Width, textura.Height); }
  4         }

 

 

 

Clase “Game”

Y ahora viene la chica: si unos de los disparos del enemigo nos da, tenemos que eliminar nuestra nave. En próximas versiones lo que haremos será decrementar el contador de vidas de nuestra nave, pero ahora sólo tendremos una vida.

Así que antes de comprobar la colisión de nuestros disparos con los enemigos, que lo vimos en la anterior entrega, comprobaremos que ningún disparo de los enemigos colisione con nuestra nave. Si colisiona, eliminaremos nuestra nave.

 

  1             foreach (Enemigo e in enemigos)
  2             {
  3                 if (e.Disparo != null && nave != null)
  4                 {
  5                     if (e.Disparo.Rect.Intersects(nave.Rectangulo))
  6                     {
  7                         nave = null;
  8                         e.Disparo = null;
  9                     }
10                 }
11             }

 

 

Como ahora nuestra nave puede ser null, tenemos que cambiar todas las referencias a nuestra nave para que antes de ejecutar cualquier cosa compruebe que la nave no es null. Si no lo hacemos, nuestro juego “petará” cuando nos de un impacto. El código entero de la clase “game” es el siguiente:

  1 using System;
  2 using System.Collections.Generic;
  3 using System.Collections;
  4 using System.Linq;
  5 using Microsoft.Xna.Framework;
  6 using Microsoft.Xna.Framework.Audio;
  7 using Microsoft.Xna.Framework.Content;
  8 using Microsoft.Xna.Framework.GamerServices;
  9 using Microsoft.Xna.Framework.Graphics;
10 using Microsoft.Xna.Framework.Input;
11 using Microsoft.Xna.Framework.Media;
12 using Microsoft.Xna.Framework.Net;
13 using Microsoft.Xna.Framework.Storage;
14
15 namespace spaceInvaders
16 {
17     /// <summary>
18     /// This is the main type for your game
19     /// </summary>
20     public class Game1 : Microsoft.Xna.Framework.Game
21     {
22         GraphicsDeviceManager graphics;
23         SpriteBatch spriteBatch;
24         Nave nave;
25         //Enemigo enemigo;
26         ArrayList enemigos;
27         
28
29         /// <summary>
30         /// Constructor de la clase
31         /// </summary>
32         public Game1()
33         {
34             graphics = new GraphicsDeviceManager(this);
35             Content.RootDirectory = "Content";
36             
37         }
38
39         /// <summary>
40         /// Allows the game to perform any initialization it needs to before starting to run.
41         /// This is where it can query for any required services and load any non-graphic
42         /// related content.  Calling base.Initialize will enumerate through any components
43         /// and initialize them as well.
44         /// </summary>
45         protected override void Initialize()
46         {
47             // TODO: Add your initialization logic here
48             nave = new Nave();
49             enemigos = new ArrayList();
50
51
52             base.Initialize();
53         }
54
55         /// <summary>
56         /// LoadContent will be called once per game and is the place to load
57         /// all of your content.
58         /// </summary>
59         protected override void LoadContent()
60         {
61             // Create a new SpriteBatch, which can be used to draw textures.
62             spriteBatch = new SpriteBatch(GraphicsDevice);
63             
64             //Le decimos a la nave que textura tiene que cargar
65             nave.Textura = Content.Load<Texture2D>("nave");
66             nave.TexturaDisparo = Content.Load<Texture2D>("disparoNave");
67
68
69             //Creamos los enemigos y los metemos en el arraylist
70             int numeroEnemigos = 5;
71             float X = 275;
72             float Y = 100;
73
74             for (int i = 0; i < numeroEnemigos;i++)
75             {
76                 Vector2 pos = new Vector2(X, Y);
77                 Enemigo e = new Enemigo(pos);
78                 enemigos.Add(e);
79                 X += 50;
80             }
81             
82             //cargamos las texturas del enemigo
83             foreach(Enemigo e in enemigos)
84             {
85                 e.Textura = Content.Load<Texture2D>("enemigo");
86                 e.TexturaDisparo = Content.Load<Texture2D>("disparoNave");
87             }
88             // TODO: use this.Content to load your game content here
89         }
90
91         /// <summary>
92         /// UnloadContent will be called once per game and is the place to unload
93         /// all content.
94         /// </summary>
95         protected override void UnloadContent()
96         {
97             // TODO: Unload any non ContentManager content here
98         }
99
100         /// <summary>
101         /// Allows the game to run logic such as updating the world,
102         /// checking for collisions, gathering input, and playing audio.
103         /// </summary>
104         /// <param name="gameTime">Provides a snapshot of timing values.</param>
105         protected override void Update(GameTime gameTime)
106         {
107             // Allows the game to exit
108             if (Keyboard.GetState().IsKeyDown(Keys.Escape))
109                 this.Exit();
110
111             // TODO: Add your update logic here
112             if (nave != null)
113                 nave.actualiza();
114
115
116             foreach (Enemigo e in enemigos)
117             {
118                 e.actualiza();
119             }
120
121
122             //comprobamos si algun disparo enemigo nos ha dado
123             foreach (Enemigo e in enemigos)
124             {
125                 if (e.Disparo != null && nave != null)
126                 {
127                     if (e.Disparo.Rect.Intersects(nave.Rectangulo))
128                     {
129                         nave = null;
130                         e.Disparo = null;
131                     }
132                 }
133             }
134
135             //Comprobamos que el disparo colisiona con algun enemigo
136             //Si colisiona, eliminamos el enemigo y el disparo
137             
138             //Array auxiliar para alamacenar los enemigos que debemos eliminar
139             ArrayList eliminar = new ArrayList();
140
141             //Si no hay disparo, no hace falta que entre
142             if (nave != null && nave.Disparo != null)
143             {
144                 //Recorremos la lista de enemigos y comprobamos si alguno colisiona
145                 foreach (Enemigo e in enemigos)
146                 {
147                     Rectangle rectEnemigo = e.Rect;
148                     Rectangle rectDisparo = nave.Disparo.Rect;
149
150                     if (rectEnemigo.Intersects(rectDisparo))
151                     {
152                         //añadimos al enemigo a la lista a eliminar
153                         eliminar.Add(e);
154                     }
155                 }
156
157                 //si la lista de enemigos a eliminar no esta vacia
158                 if (eliminar.Count > 0)
159                 {
160                     foreach (Enemigo el in eliminar)
161                     {
162                         //eliminamos al enemigo
163                         enemigos.Remove(el);
164                     }
165
166                     //eliminamos el disparo
167                     nave.Disparo = null;
168                 }
169             }
170
171
172             base.Update(gameTime);
173         }
174
175         /// <summary>
176         /// This is called when the game should draw itself.
177         /// </summary>
178         /// <param name="gameTime">Provides a snapshot of timing values.</param>
179         protected override void Draw(GameTime gameTime)
180         {
181             GraphicsDevice.Clear(Color.Black);
182
183             // TODO: Add your drawing code here
184             spriteBatch.Begin();
185             
186            if (nave != null) nave.Draw(spriteBatch); //pitnamos la nave
187             foreach (Enemigo e in enemigos)
188             {
189                 e.Draw(spriteBatch);
190             }
191             
192
193             spriteBatch.End();
194
195
196             base.Draw(gameTime);
197         }
198     }
199 }
200

 

 

Y ya está! ya tenemos nuestros enemigos disparando y nosotros también disparando.

Como siempre, puedes bajarte el código fuente del siguiente enlace:

down  Descargar Código Fuente del tutorial

 

 

Un saludo y hasta la próxima entrega!

]]> http://www.xna-tutorial.com/tutorial-entrega-5-aadiendo-disparos-de-los-enemigos/feed/ 7 Platformer Starter Kit Mejorado http://www.xna-tutorial.com/platformer-starter-kit-mejorado/ http://www.xna-tutorial.com/platformer-starter-kit-mejorado/#comments Mon, 21 Dec 2009 12:29:15 +0000 rantamplan http://www.xna-tutorial.com/platformer-starter-kit-mejorado/ Mirando en los foros de XNA me he encontrado con este topic: http://forums.xna.com/forums/t/34901.aspx

En el se ofrece el código fuente de un juego basado en el Starter Kit de plataformas que viene incluido con XNA a partir de la versión 3.0.

platformer

Contiene numerosas mejoras para partir de el para hacer un juego de plataformas en XNA.

Características:

  • Game State Management (Menu)
  • Global Score
  • Scrolling levels (vertical and horizontal)
  • Custom level information from within the text file (Title, Time Limit, Description)
  • Level Select
  • Falling Apples
  • Options
  • Built in BSOD (incase any error happens you can see what it is)
  • In Game Level Editor (Beta, saving part under progress)
  • Ladders
  • option for 320×240 or 640×480 (in the ScreenManager.cs, "Game Configuration Fields" region near top, set the "useHighResolution" to true or false)
  • A Racing opponent (Turns directions by bumping into walls, Jumps on assigned "J" tiles)
  • Vanishing Tiles
  • Hidden Tiles (Both Solid and platform)
  • Death Tiles
  • Skin selections
  • Powerups

 

El código fuente lo podéis descargar desde el enlace que proporciona el creador:  http://www.mediafire.com/?ydyzwtilmkc

]]> http://www.xna-tutorial.com/platformer-starter-kit-mejorado/feed/ 1 Tutorial [Entrega 4]: Añadiendo enemigos http://www.xna-tutorial.com/tutorial-entrega-4-aadiendo-enemigos/ http://www.xna-tutorial.com/tutorial-entrega-4-aadiendo-enemigos/#comments Thu, 17 Dec 2009 09:31:00 +0000 rantamplan http://www.xna-tutorial.com/?p=210 Continuamos con la siguiente entrega del tutorial. Llegados a este punto, tenemos a una nave que disipara. La nave se mueve con las teclas de dirección y dispara pulsando la tecla de dirección arriba. Pero…. ¿a qué dispara? Hoy introduciremos los enemigos para que sirvan de diana, XD. Y lo de siempre, para cualquier duda tienes el foro: http://www.foro.xna-tutorial.com/viewtopic.php?f=4&t=4

image

Mira el tutorial después del salto.

Así que sigues interesado en XNA y el ejemplo del Space Invaders, eh? Pues aquí tienes como meter los enemigos.

 

Clase Enemigo.cs

Al igual que hicimos con la clase “Nave.cs”, vamos a crear una nueva clase donde encapsular métodos y atributos necesarios para el enemigo.

Atributos

Como atributos vamos a tener los mismos que e la nave: el sprite de la nave, la posición, y el disparo de los enemigos y la textura del disparo de los enemigos.

  1         private Vector2 pos; //posicion del enemigo
  2         private Texture2D textura; //textura del enemigo
  3          
  4         private Disparo disp; //disparo
  5         private Texture2D texturaDisparo; //Textura del disparo

 

 

Y las propiedades para cada atributo:

 

  1         public Vector2 Posicion 
  2         { 
  3             get { return pos; } 
  4             set { pos = value; } 
  5         } 
  6          
  7         public Texture2D Textura 
  8         { 
  9             get { return textura; } 
10             set { textura = value; } 
11         } 
12
13         public Disparo Disparo 
14         { 
15             get { return disp; } 
16             set { disp = value; } 
17         } 
18
19         public Texture2D TexturaDisparo 
20         { 
21             get { return texturaDisparo; } 
22             set { texturaDisparo = value; } 
23         }

 

Vamos a ver ahora que métodos necesita, aunque supongo que ya te imaginarás que necesita prácticamente los mismo métodos que nuestra clase “Nave.cs”

 

Métodos

 

  1         /// <summary>
  2         /// Constructor por defecto del enemigo
  3         /// </summary>
  4         public Enemigo()
  5         {
  6             pos = new Vector2(400,100);
  7         }
  8
  9
10         /// <summary>
11         /// consturctor sobrecargado del enemigo donde le damos una pos inicial
12         /// </summary>
13         public Enemigo(Vector2 posicion)
14         {
15             pos = posicion;
16         }
17
18         /// <summary>
19         /// Comprueba el teclado y mueve la nave segun las teclas pulsadas
20         /// </summary>
21         public void actualiza()
22         {
23              //De momento nuestro enemigo no hace nada 
24         }
25
26
27
28         /// <summary>
29         /// Pinta la nave y el disparo si lo tiene
30         /// </summary>
31         /// <param name="batch"></param>
32         public void Draw(SpriteBatch batch)
33         {
34             batch.Draw(textura, pos, Color.White);
35
36             //Pintamos el disparo
37             if (disp != null)
38             {
39                 batch.Draw(disp.Textura, disp.Posicion, Color.White);
40             }
41         }

 

Ahora podemos introducir nuestros enemigos en el juego. Vamos a ver como los introducimos.

 

Clase “Game1.cs”

Como queremos tener unos cuantos enemigos en la pantalla (solo uno seria muy aburrido), vamos a crearnos una nueva lista donde meteremos a nuestros enemigos.

  1 ArrayList enemigos;

 

Y en el método Initialize() inicializaremos el array:

 

  1        protected override void Initialize()
  2         {
  3             // TODO: Add your initialization logic here
  4             nave = new Nave();
  5             enemigos = new ArrayList();
  6
  7
  8             base.Initialize();
  9         }

 

 

 

El método LoadContent() es el que más tela tiene, así que lo voy a comentar:

  1             //Creamos los enemigos y los metemos en el arraylist
  2             int numeroEnemigos = 5;
 
Con esta variable le decimos el numero de enemigos que queremos ver en la pantalla, en este caso 5.
  3             float X = 275;
  4             float Y = 100; 
 

Estas dos variables son las coordenadas de donde queremos que se pinte el primer enemigo. En este caso, al ser 5 enemigos, le voy a decir que el primero se pinte a la izquierda para que el conjunto quede centrado en la pantalla.

Ahora, con un bucle, creamos los enemigos, metiendo una separación de 50pix entre cada uno, y los metemos en la lista de enemigos.
  6             for (int i = 0; i < numeroEnemigos;i++)
  7             {
  8                 Vector2 pos = new Vector2(X, Y);
  9                 Enemigo e = new Enemigo(pos);
10                 enemigos.Add(e);
11                 X += 50;
12             }
13             
 
Ahora, para cada enemigo de la lista, tenemis que decirle que texturas vamos a cargar. En este caso, todos los enemigos tienen la misma textura, y el disparo es el mismo que dispara nuestra nave.
14             //cargamos las texturas del enemigo
15             foreach(Enemigo e in enemigos)
16             {
17                 e.Textura = Content.Load<Texture2D>("enemigo");
18                 e.TexturaDisparo = Content.Load<Texture2D>("disparoNave");
19             }

 

Por cierto, aquí os dejo el sprite del enemigo:

enemigo

enemigoBIG

Si le dais a” botón derecho/guardar imagen como” os podéis guardar el sprite.

 

Ahora queda pintar a los enemigos en la pantalla. Nota: El método update() me lo salto porque de momento los enemigos no hacen nada.

Pues al igual que con la nave, tenemos que decirle a todos los enemigos que se pinten. Para ellos, recorremos la lista con un bucle “foreach” dela siguiente manera:

 

  1             foreach (Enemigo e in enemigos)
  2             {
  3                 e.Draw(spriteBatch);
  4             }

 

 

Y ya está. Ya tenemos a 5 enemigos en nuestra pantalla. Si quieres puedes ir jugando con las posiciones iniciales de los enemigos, meter mas filas de enemigos, etc. hasta que escriba el siguiente tutorial, donde haremos que los enemigos se muevan!!!

Y como siempre, el código fuente del tutorial:

 

down Descargar código fuente

 

 

 

Si tienes alguna duda con el tutorial, puedes preguntármela en el foro: http://www.foro.xna-tutorial.com/viewtopic.php?f=4&t=4

Un saludo a todos!

]]> http://www.xna-tutorial.com/tutorial-entrega-4-aadiendo-enemigos/feed/ 3 Tutorial [Entrega 2]: Moviendo un sprite por la pantalla http://www.xna-tutorial.com/moviendo-un-sprite-por-la-pantalla/ http://www.xna-tutorial.com/moviendo-un-sprite-por-la-pantalla/#comments Mon, 14 Dec 2009 19:08:46 +0000 rantamplan http://www.xna-tutorial.com/moviendo-un-sprite-por-la-pantalla/  

Parece que ha habido un error y la 2º parte del tutorial se ha borrado, asi que vuelvo a subirlo: Un saludo y perdonar las molestias

 

 

Continuamos la serie de tutoriales con lo más básico de XNA: crear el proyecto y mover un sprite por la pantalla.

En esta entrega crearemos un proyecto de XNA 3.1 y dibujaremos por la pantalla un sprite (nuestra nave) y haremos que se mueva por la pantalla. Vamos a empezar por cosas fáciles y ya iremos subiendo poco a poco el nivel de dificultad.

Encontrarás el tutorial completo después del salto.

Creando el proyecto

Lo primero que tenemos que hacer es crear un nuevo proyecto de XNA. Para ello, abrimos el VS2008 (o el Visual C# Studio si tienes la versión gratuita) y le damos a “Archivo/Nuevo/Proyecto”.

image

 

 

Nos saldrá una nueva ventana donde debemos elegir como tipo de proyecto “XNA Game Studio 3.1” y como plantilla “Windows Game”.

 

image

 

 

También le debemos dar un nombre al proyecto. Como hoy estoy poco ingenioso, lo llamaré simplemente “Space Invaders”. Vosotros podéis darle el nombre que queráis.

Si le damos a aceptar, veremos que se creará un proyecto nuevo, con varios ficheros (Game1.cs, Program.cs). Vemos que ya hay código escrito, y si le damos a F5 nos saldrá una pantalla azul. Esa pantalla es nuestro  futuro juego.  El fichero Program.cs no debemos tocarlo.

Creando la nave

Ahora vamos a crear nuestra nave y pintarla en la pantalla esa azul que nos ha salido antes.

Para ello, en el archivo Game1.cs nos creamos una variable llamada nave de tipo ‘Texture2D’ que representará nuestra nave para combatir la invasión alienígena y un nuevo tipo de dato que trae XNA llamado ‘Vector2’ para almacenar la posición de la nave.

private Texture2D nave;
private Vector2 pos;

 

 

Ahora vamos al método Initialize(). En este método iniciamos la posición inicial de la nave. El resultado del método os quedará así:

protected override void Initialize()
{
// TODO: Add your initialization logic here
pos = new Vector2(400,550);base.Initialize();
}

 

 

Ya tenemos la posición de la nave. Ahora le tenemos que indicar al programa que sprite queremos usar como nave. Así que os dejo yo aquí uno muy chulo hecho por mi con gran destreza haciendo uso de mis años usando el Paint, XD.

nave

 

Bien, para cargar la imagen primero tenemos que agregarla al directorio “Content” del juego. Para ello, le damos a “Botón Derecho” sobre “Content” y seleccionamos “Agregar/Elemento Existente”. Buscamos el sprite y le damos a aceptar. También podemos arrastrar directamente una imagen al directorio.

 

image

 

 

Ahora en nuestro proyecto tenemos un sprite llamado “nave”. Para cargarlo, usaremos el método ‘Load()’ dentro de nuestro método LoadContent(). Nos quedará algo así:

protected override void LoadContent()
{
// Create a new SpriteBatch, which can be used to draw textures.
spriteBatch = new SpriteBatch(GraphicsDevice);
nave = Content.Load<Texture2D>("nave");// TODO: use this.Content to load your game content here
}

 

 

Ahora ya falta dibujarlo por la pantalla. Así que en el método Draw() escribimos el siguiente código para pintarlo.

protected override void Draw(GameTime gameTime)
{
GraphicsDevice.Clear(Color.CornflowerBlue);// TODO: Add your drawing code here
spriteBatch.Begin();
spriteBatch.Draw(nave, pos, Color.White);
spriteBatch.End();
base.Draw(gameTime);
}

 

 

Si le damos ahora a F5 nos mostrará por la pantalla un fondo azul y nuestra nave. Igual que esta imagen:

 

image

 

 

Muy bonito, si, pero todavía no podemos hacer nada con ella, así que vamos a ver como moverla por la pantalla.

 

Para ello, volvemos al método “update()” y escribimos dos instrucciones if: una para mover a la izquierda y otra para mover a la derecha.

protected override void Update(GameTime gameTime)
{
// Allows the game to exit
if (Keyboard.GetState().IsKeyDown(Keys.Escape))
this.Exit();

// TODO: Add your update logic here
if (Keyboard.GetState().IsKeyDown(Keys.Left))
pos.X -= 5;
if (Keyboard.GetState().IsKeyDown(Keys.Right))
pos.X += 5;
base.Update(gameTime);
}

 

 

Ahora, si le damos a F5, con las teclas de dirección podremos mover nuestra nave hacia izquierda y derecha. Fácil, verdad?

En la próxima entrega crearemos una clase para nuestra nave para poder controlarla mejor y haremos que pueda disparar.

 

down Descargar Código Fuente

 

Hasta la próxima entrega!

]]> http://www.xna-tutorial.com/moviendo-un-sprite-por-la-pantalla/feed/ 2 Libro electrónico XNA gratuito http://www.xna-tutorial.com/libro-electrnico-xna-gratuito/ http://www.xna-tutorial.com/libro-electrnico-xna-gratuito/#comments Mon, 14 Dec 2009 09:23:00 +0000 rantamplan http://www.xna-tutorial.com/libro-electrnico-xna-gratuito/ Desde la web www.facultyresourcecenter.com podemos descargarnos un fantastico libro gratuito de XNA. Está en inglés, pero no debería ser un problema para vosotros.

El libro se titula “Introduction to Programming Through Game Development Using Microsoft XNA Game Studio”. Ocupa sólo 9 Mb y si, está en inglés. Pero el ingles no debería ser un problema para vosotros. Además también puedes bajarte el ejemplo. Para ser gratuito, esta bastante bien.

Para bajaros el pdf, tenéis que pinchar en este enlace: https://www.facultyresourcecenter.com/curriculum/pfv.aspx?ID=8119 y desde aquí darle a “Download”.

Os dejo con el temario del libro por si queréis consultar algún capitulo en especial.

  1. C# Development
  2. Introduction to Programming Through Game Development Using Microsoft XNA Game Studio – Chapter 1: Computers, C#, XNA and You
  3. Introduction to Programming Through Game Development Using Microsoft XNA Game Studio – Chapter 10: Using Methods
  4. Introduction to Programming Through Game Development Using Microsoft XNA Game Studio – Chapter 11: A Game as a Program
  5. Introduction to Programming Through Game Development Using Microsoft XNA Game Studio – Chapter 12: Games, Objects and State
  6. Introduction to Programming Through Game Development Using Microsoft XNA Game Studio – Chapter 13: Making a Complete Game
  7. Introduction to Programming Through Game Development Using Microsoft XNA Game Studio – Chapter 14: Classes, Objects and Games
  8. Introduction to Programming Through Game Development Using Microsoft XNA Game Studio – Chapter 15: Creating Game Components
  9. Introduction to Programming Through Game Development Using Microsoft XNA Game Studio – Chapter 16: Creating Multi-Player Networked Games
  10. Introduction to Programming Through Game Development Using Microsoft XNA Game Studio – Chapter 2: Programs and Colors
  11. Introduction to Programming Through Game Development Using Microsoft XNA Game Studio – Chapter 3: Getting Player Input
  12. Introduction to Programming Through Game Development Using Microsoft XNA Game Studio – Chapter 4: Displaying Images
  13. Introduction to Programming Through Game Development Using Microsoft XNA Game Studio – Chapter 5: Writing Text
  14. Introduction to Programming Through Game Development Using Microsoft XNA Game Studio – Chapter 6: Creating a Multi-Player Game
  15. Introduction to Programming Through Game Development Using Microsoft XNA Game Studio – Chapter 7: Playing Sounds
  16. Introduction to Programming Through Game Development Using Microsoft XNA Game Studio – Chapter 8: Creating a Timer
  17. Introduction to Programming Through Game Development Using Microsoft XNA Game Studio – Chapter 9: Reading Text Input
  18. Introduction to Programming Through Game Development Using Microsoft XNA Game Studio – Instructor Preparation Guide
  19. Introduction to Programming Through Game Development Using Microsoft XNA Game Studio – Text Sample Code
]]> http://www.xna-tutorial.com/libro-electrnico-xna-gratuito/feed/ 0 Tutorial [Entrega 3]: Añadiendo disparos http://www.xna-tutorial.com/tutorial-entrega-3-aadiendo-disparos/ http://www.xna-tutorial.com/tutorial-entrega-3-aadiendo-disparos/#comments Fri, 04 Dec 2009 15:28:00 +0000 rantamplan http://www.xna-tutorial.com/?p=174 Continuamos con las entregas del tutorial para hacer un clon del Space Invaders en XNA.

Ahora que ya tenemos una nave protagonista moviéndose por la pantalla, le realizaremos algunas mejoras a la nave y haremos que pueda dispara.

Podrás leer el tutorial completo después del salto. Y recuerda que si tienes alguna duda con el tutorial, puedes preguntármela en el foro: http://www.foro.xna-tutorial.com/viewtopic.php?f=4&t=4

Sabras de jugar a juegos, tanto si son de consola como si son de otro tipo como PartyPoker español que tener una guia ayuda bastante a mejorar.Los consejos en los juegos son esenciales para jugar a un buen nivel. Espero que el siguiente tutorial te sea de ayuda.

Clase Nave

Para empezar, vamos a encapsular nuestra nave en una clase llamada “Nave”. Esto lo deberíamos haber hecho desde el principio, pero como quería mostraros lo fácil que era cargar sprites en XNA y moverlos por la pantalla, me lo pase por alto.

Para crear la clase “Nave”, clicamos con el botón derecho sobre el proyecto y de damos a “Agregar/Clase”.

image

Como nombre escribimos “Nave.cs” y le damos a “Agregar”. Vale, ya tenemos nuestra clase. Ahora vamos a completarla.

Atributos

De momento, vamos a crear dos atributos:

private Vector2 pos; //posicion de la nave
private Texture2D textura; //textura de la nave

Y sus respectivas propiedades:

public Vector2 Posicion
{
get { return pos; }
set { pos = value; }
}

public Texture2D Textura
{
get { return textura; }
set { textura = value; }
}

Métodos

Necesitamos el constructor de la clase, donde le daremos una posición inicial a la nave, un método para actualiza la posición de la nave, y otro ultimo para pintar la nave en la pantalla.

CONSTRUCTOR

public Nave()
{
pos = new Vector2(400,550); //nave centrada en la pantalla, parte inferior
}

METODO ACTUALIZA

Ahora, además de mover la nave, vamos a comprobar que no se salga de la pantalla. Si esto ocurre, no le vamos a dejar moverse.

public void actualiza()
{
if (Keyboard.GetState().IsKeyDown(Keys.Left))
{
if (pos.X > 0) //no se sale por la izquierda
pos.X -= 5;
}
if (Keyboard.GetState().IsKeyDown(Keys.Right))
{
if (pos.X + textura.Width < 800) //no se sale por la derecha
pos.X += 5;
}
}

METODO DRAW

public void Draw(SpriteBatch batch)
{

//Pintamos la nave
batch.Draw(textura, pos, Color.White);

}

Ya tenemos nuestra clase nave. Vamos ahora con la siguiente.

Clase Disparo

Ahora vamos a crear la clase disparo. Realmente no haría falta, ya que podríamos asignar al personaje una nueva textura y una variable posición y lo tendríamos solucionado. Sin embargo, pensando a largo plazo, creo que nos va a venir bien una clase disparo para poder meterle animaciones, distintos tipos de disparos, etc…

Atributos

De momento, vamos a crear cuatro atributos:

private Vector2 pos; //posición del disparo
private Texture2D textura; //textura del disparo
private bool vivo; //indica si el disparo aun esta en el juego

Y sus respectivas propiedades:

public Vector2 Posicion
{
get { return pos; }
set { pos = value; }
}
public Texture2D Textura
{
get { return textura; }
set { textura = value; }
}
public bool Vivo
{
get { return vivo; }
set { vivo = value; }
}

Métodos

Al igual que antes, vamos a programar un constructor de la clase y un método al que llamaremos para actualizar su posición en la pantalla.

Para el constrictor, necesitaremos una posición inicial y un sprite. Lo posición inicial:

public Disparo(Vector2 posicionInicial, Texture2D sprite)
{
pos = posicionInicial;
textura = sprite;
vivo = true;
}

El método actualiza lo usaremos para comprobar que el disparo sale de la pantalla o no. Si sale de la pantalla, pondremos su variable “vivo” a false. Si sigue vivo, entonces lo movemos.

public void actualiza()
{
if (pos.Y + textura.Height < 0) vivo = false;
if (pos.Y > 600) vivo = false;

if (vivo)
pos.Y -= 10;
}

Cambios en la clase nave

Ahora que ya tenemos una clase disparo, vamos a hacer que nuestra nave pueda disparar. Solo le vamos a permitir un disparo (al igual que en el juego original), y hasta que ese disparo no impacte con un enemigo, o se salga de la pantalla, no vamos a poder volver a disparar.

Para hacer esto, tenemos que realizar las siguientes modificaciones en la clase “Nave.cs”

public void actualiza()
{
if (Keyboard.GetState().IsKeyDown(Keys.Left))
{
if (pos.X > 0)
pos.X -= 5;
}
if (Keyboard.GetState().IsKeyDown(Keys.Right))
{
if (pos.X + textura.Width < 800)
pos.X += 5;
} //Añadimos el disparo
if (Keyboard.GetState().IsKeyDown(Keys.Up))
{
if (disp == null)
disp = new Disparo(new Vector2(pos.X + textura.Width/2, pos.Y), texturaDisparo); //la posicion del disparo es la mitad de nuestra nave
}

//Si el disparo esta vivo, lo movemos. Si no, lo ponemos a null
//para poder volver a disparar
if (disp != null)
{
if (disp.Vivo)
disp.actualiza();
else
disp = null;
}
}

public void Draw(SpriteBatch batch)
{
batch.Draw(textura, pos, Color.White);

//Pintamos el disparo
if (disp != null)
{
batch.Draw(disp.Textura, disp.Posicion, Color.White);
}
}

Clase Game1.cs

Y ya tenemos nuestra clase “Disparo”. Ahora nos falta agregar la lógica necesaria en “Game1.cs”.

Lo que haremos en “Game1.cs” será definirnos y crearnos la nave:

Nave nave;

Cargar las texturas necesarias para la nave y el disparo de la nave:

protected override void LoadContent()
{
// Create a new SpriteBatch, which can be used to draw textures.
spriteBatch = new SpriteBatch(GraphicsDevice); //Le decimos a la nave que textura tiene que cargar
nave.Textura = Content.Load<Texture2D>(“nave”);
nave.TexturaDisparo = Content.Load<Texture2D>(“disparoNave”); // TODO: use this.Content to load your game content here
}

Llamar al método actualizar de nuestra nave en cada bucle del juego:

protected override void Update(GameTime gameTime)
{
// Allows the game to exit
if (Keyboard.GetState().IsKeyDown(Keys.Escape))
this.Exit(); // TODO: Add your update logic here

nave.actualiza();

base.Update(gameTime);
}

Y por ultimo pintar la nave. pero ahora como nuestra clase nave tiene un método para pintarse, simplemente llamaremos a ese método pasándole como argumento nuestro Spritebacht.

protected override void Draw(GameTime gameTime)
{
GraphicsDevice.Clear(Color.Black); //Pintamos el fondo de negro // TODO: Add your drawing code here
spriteBatch.Begin();
nave.Draw(spriteBatch);
spriteBatch.End(); base.Draw(gameTime);
}

Y voilá!! Tenemos nuestra nave moviéndose por la pantalla, pero sin salirse de ella, y disparando con la tecla “Arriba”. Al igual que el Space Invaders, solo podemos tener un disparo en la pantalla.

spinvaders

Como podéis observar, le he cambiado el color de fondo para que en lugar de azul sea negro. Además, he pintado la nave de blanco para que se vea mejor. Así conseguimos un estilo más “retro”.

Y como siempre, aquí tenéis el código fuente para poder probarlo vosotros mismos.

image Descargar Código Fuente

Si tienes alguna duda con el tutorial, puedes preguntármela en el foro: http://www.foro.xna-tutorial.com/viewtopic.php?f=4&t=4

Un saludo y hasta la próxima entrega, donde añadiremos a los enemigos!!

]]> http://www.xna-tutorial.com/tutorial-entrega-3-aadiendo-disparos/feed/ 6 Visualizador Animaciones 2D http://www.xna-tutorial.com/visualizador-animaciones-2d/ http://www.xna-tutorial.com/visualizador-animaciones-2d/#comments Thu, 03 Dec 2009 12:00:32 +0000 rantamplan http://www.xna-tutorial.com/?p=95 Hoy os traigo una herramienta que puede ser  muy útil para los desarrolladores de juegos 2D, ya que permite visualizar las animaciones de un sprite sin necesidad de compilar y arrancar el juego, además de poder configurar varios parámetros para poder ver la animación correctamente.

De esta forma, los dibujantes pueden ir trabajando paralelamente a los programadores e ir adelantando trabajo, XD.

img2

Visualizador Animaciones 2D

Debido a la implementación del programa, sólo funciona correctamente cuando se cumple que:
- Cada animación se encuentra en un fichero distinto. (Uno para la de saltar, otra para correr, otra para disparar….)
- Todos los frames están en la misma fila (muchas columnas, pero sólo 1 fila).

Esto es debido a la implementación de la animaciones, ya que siguen el ejemplo del “Platformer Starter Kit” que viene con XNA 3.0.

En la web de descarga de XNACommunity puedes bajarte el código fuente del programa y (si quieres) modificarlo a tu antojo para que se adapte a tus necesidades. Además, en la web de descarga puedes leer como se usa el programa.

Descargate el código fuente desde XNACommunity.

Un saludo

]]> http://www.xna-tutorial.com/visualizador-animaciones-2d/feed/ 0 Tutorial: Agregar un sprite básico a tu juego http://www.xna-tutorial.com/tutorial-agregar-un-sprite-basico-a-tu-juego/ http://www.xna-tutorial.com/tutorial-agregar-un-sprite-basico-a-tu-juego/#comments Sun, 22 Nov 2009 20:00:28 +0000 Agustin http://www.xna-tutorial.com/?p=105 Bueno, antes que nada quiero empezar por asumir que ya instalaron XNA 3.0 ó 3.1 en su sistema y estan usando visual studio: cualquier version que tengan.

Este tutorial usa Visual Studio 2008 + XNA 3.1, pero por la simplicidad XNA 3.0 es lo mismo.

Abriremos Visual Studio, y abriremos un nuevo proyecto. (Archivo + nuevo + projecto) y lo llamaremos: SpriteTest

Una vez que la pantalla de visual studio muestre ya nuestro código por modificar notaremos lo siguiente:

  • La clase de nuestro se llama: Game1
  • Dentro de esta clase los métodos principales son:
  1. Initialize(); – Inicializa todo lo que va dentro del juego en forma de código
  2. LoadContent(); – Obtiene la referencia de los objetos conforme a su localización física
  3. Update(); – Este método es importante para actualizar nuestros objetos
  4. Draw(); – Este método dibuja los objetos que queremos usar

Antes que nada, necesitamos agregar un sprite a nuestro proyecto, esto lo haremos en el folder de contenido, haremos un folder nuevo llamado Imágenes.

  1. Click derecho en folder de contenido (parte izquierda del visual studio)
  2. Agregar
  3. Nuevo Folder (llamarlo Imágenes)

En este folder agregaremos el sprite que queremos utilizar, de la misma manera que agregamos el folder pero en lugar de agregar el folder, agregaremos un objeto existente. Pueden usar la imágen que quieran por la simplicidad no importa que imagen sea pero que sea suficientemente pequeña para que quepa en la pantalla.

Ahora empieza lo interezante, El sprite básico en sí no lo podemos poner en el código y tratar de usarlo nadamas así, sino que necesitamos referenciarlo para que podamos reusar esta imágen cuantas veces queramos.

Necesitamos agregar una variable de clase a nuestro juego,  el típo de variable es de tipo Texture2D, este tipo de variables es muy útil por que nos ayuda a agregar todo típo de imágenes en 2 dimensiones. puede ser fondos, fotos, imágenes etc.

Al inicio de nuestra clase Game1 agregaremos la siguiente variable de textura:

Texture2D textura;

Señalando:

  • Texture2D – Tipo de la variable, tipo de variables que hay: int, float, string, Vector2… entre muchas otras
  • textura  - Nombre de la variable
  • ;  - No se nos olvide el famoso “;” sin esto el código no correría es la terminación de código o línea de código

Una vez agregada esa variable al inicio, buscaremos el método de LoadContent(), puesto que ahi….. Así es adivinaron! es donde referenciaremos la imágen con su nombre. Es decir, buscaremos la localización física de esta imágen y la coordinaremos con su nombre de variable (textura)

en el método de LoadContent() agregaremos lo siguiente:

textura = Content.Load<Texture2D>(@”Images\logo”);

Cosas por notar:

  • Aqui estamos cargando la imágen y la estamos poniendo en la variable “textura”
  • Content.Load – Carga los objetos
  • <Texture2D> – El tipo de objeto por cargar
  • (@”Images\logo”) – el lugár físico de la imágen. Recuerden que agregamos la imágen al folder de contenido/imagenes

Una vez hecho esto la imágen ya esta lísta para ser mostrada, pero todvía no. Necesitamos dibujarla antes de poder verla en nuestra ventana de animación!

Buscaremos el método de Draw() en el cuál dibujaremos la imágen o textura a nuestra ventana. En Draw() agregaremos el siguiente código:

spriteBatch.Begin();

spriteBatch.Draw(textura, Vector2.Zero, Color.White);

spriteBatch.End();

Cosas por notar:

  • spriteBatch.Begin() – inicializa la paleta de dibujo, los colores el espacio para poder agregar imágenes
  • spriteBatch.Draw() – dibuja el objeto o textura que estamos utilizando, en este caso adquiere 3 parametros:
  1. textura – Nombre de la Textura o Texture2D
  2. Vector2.Zero – Posición de la textura
  3. Color.White – Se podría decir que el tipo de luz que se le aplicara al objeto

Por fin ya esta dibujado y ya puden probar si funciona o no! construyan su proyecto (F5), y veamos como salió

Podremos ver en la ventana que surge, nuestra imágen estática en la posición alta izquierda. La razón por la cuál esta en esa pocisión es por que nuestro código le esta diciendo que se vaya al orígen. Es decir Vector2.Zero en cierta forma es como decir posición: (0, 0)

Resultado Final

El código de fuente lo puedes encontrar aqui

]]> http://www.xna-tutorial.com/tutorial-agregar-un-sprite-basico-a-tu-juego/feed/ 3 Veks and Silence http://www.xna-tutorial.com/veks-and-silence/ http://www.xna-tutorial.com/veks-and-silence/#comments Wed, 07 Oct 2009 06:51:32 +0000 admin http://www.xna-tutorial.com/?p=60 Se vislumbran brotes verdes, después del inicio a trompicones de los desarrolladores, empiezan a surgir juegos que merece la pena jugar, son juegos que ya tienen un mínimo nivel de gráficos y una jugabilidad que echamos de menos en los juegos de nueva generación.

Es un juego mata-zombies nada mejor para dejar de lado el estres laboral en un entorno amigable, con zombies que rebientan en mil pedazos y sangre para dar y regalar. En cuanto a la inteligencia artificial es muy simple, la misma que tienen los zombies “en la vida real”, es decir, veo un cacho carne y a por el.

El juego esta desarrollado en 3d pero es un 2d con scrolling, se hecha de menos el tener un compañero de batalla al lado que nos ayude a esparcir sangre zombie por todo el escenario pero aun así cumple con su cometido, entretener con un nivel aceptable de gráficos. Seguro que estaís deseando ver algunas capturas de pantalla, pero os lo voy a poner mejor, os dejo un video game play.


]]> http://www.xna-tutorial.com/veks-and-silence/feed/ 0 DishWasher: Dead Samurai http://www.xna-tutorial.com/dishwasher-dead-samurai/ http://www.xna-tutorial.com/dishwasher-dead-samurai/#comments Fri, 24 Apr 2009 19:00:09 +0000 admin http://www.xna-tutorial.com/?p=31 Os traigo un juego que tiene muy buena pinta y ademas una buena idea por detrás. El juego tiene como finalidad soltar adrenalina, es un juego mata mata, donde abunda la sangre y los movimientos especiales.  Realmente descarga tensiones y es recomendable si acabas de llegar del trabajo con el cuello engarrotado por culpa del jefe. Veamos un video trailer y luego hablamos un poco de la programación que hay detrás.


Como habeis podido ver en el video las animaciones son acojonantes, pero no dispone de animaciones, estas son construidas mediante rotaciones y translaciones. El muñecajo esta dividido en partes, y realizar un movimiento supone calcular la rotacion y posicion de cada parte y unirlas todas juntas. Esto tiene muchisima programación pero el resultado lo merece.

Algun dia si tengo tiempo (que va a ser que no) intentaremos hacer un ejemplo sencillito de esta idea.

]]> http://www.xna-tutorial.com/dishwasher-dead-samurai/feed/ 0