miércoles, 2 de junio de 2010

Creando nuestra primera clase en Xna

2 comentarios
 
Bueno en la última entrega vimos como cargar una imágen en Xna, en éste caso vamos a crear una clase para cargar una imágen en Xna. ¿Para que nos sirve esto? para que cada vez que querramos cargar una imágen no tengamos que escribir todo el código de nuevo, y simplemente llamemos al código que se encuentra en la clase.

Empecemos: Sobre el nombre de nuestro proyecto, en el explorador de soluciones, botón derecho del mouse, Agregar nuevo elemento. Una vez en la ventana que nos aparece, seleccionamos clase y le ponemos un nombre, en mi caso le puse imagen, ya que ésta clase la vamos a usar para cargar imágenes.

En la región includes vamos a añadir lo siguiente.
using Microsoft.Xna.Framework;
using Microsoft.Xna.Framework.Content;
using Microsoft.Xna.Framework.Graphics;

Esto es necesario ya que lo necesitamos para trabajar con las imágenes.
Luego, abajo de     class imagen  {
Vamos a crear un vector que nos va a servir para definir la posición de la imágen, y vamos a crear una variable del tipo Texture2D para poder cargar la imágen que deseemos.

public Vector2 Position = new Vector2(0, 0);
private Texture2D mSpriteTexture;

El vector llamado Position lo definimos como público ya que necesitamos usarlo desde nuestro main (Game1.cs)  y la textura como privada. Para los que no entiendan bien estos términos recomendamos hacer algun tutorial de C# o de C++ ya que son cosas específicas del lenguaje.

Al igual que hicimos en nuestro main, vamos a tener que hacer un método para cargar nuestro contenido, quedandonos algo asi:

  public void LoadContent(ContentManager theContentManager, string theAssetName)
        {

            mSpriteTexture = theContentManager.Load(theAssetName);

        }

Acá le tenemos que pasar el contentmanager  ya que de otra forma no lo podríamos obtener y el nombre de la imágen. Dentro de la función le asignamos a la textura la imágen.
Ya tenemos cargada la imágen ahora nos queda dibujarla, bueno al igual que en nuestro main, vamos a hacer un método Draw.

       public void Draw(SpriteBatch theSpriteBatch)
        {

            theSpriteBatch.Draw(mSpriteTexture, Position, Color.White);

        }

Acá le pasamos el sprite, textura, dibujo o como más les guste llamarle, y lo dibujamos en la posición "Position" y con el color de la imágen sin alterarla.

Bien ya tenemos nuestra clase para cargar imágenes, ahora lo que tenemos que hacer es borrar el código anterior en nuestro main y añadir algunas modificaciones.
Primero tenemos que borrar lo que declaramos

        //Declaramos Fondo como una variable de tipo Texture2D
        Texture2D Fondo;
        //Declaramos Rectangulo como una variable de tipo Rectangle
        Rectangle Rectangulo;

ya que esto lo estamos haciendo en nuestra clase, y vamos a declarar una variable del tipo de nuestra clase.

imagen cubito;

ahí declaramos a cubito del tipo de nuestra clase imagen. Luego de declararla tenemos que inicializarla, bueno vamos al initialize y ponemos algo así:

cubito = new imagen();


Vamos a borrar lo que habíamos hecho anteriormente en el Load y vamos a cargar nuestra imágen.

 cubito.LoadContent(this.Content, "cubito");

Acá llamamos al loadcontent de la clase y cargamos a cubito

 cubito.Position = new Vector2(125,200);

Le definimos la posición a cubito llamando a position de nuestra clase y definiendo el vector.
Ya casi terminamos ahora lo único que nos falta es dibujar a cubito, bueno para eso vamos a reemplazar lo que habíamos hecho en la entrega anterior en el metodo Draw por lo siguiente:

Remplazamos spriteBatch.Draw(Fondo, Rectangulo, Color.White);

Por cubito.Draw(this.spriteBatch);

Ahora le podemos dar play y ver los resultados.

En la próxima entrega vamos a ver como cargar múltiples imágenes.

Próximamente dejo el link con los fuentes con el código bastante comentado, igual cabe aclarar que cada vez se irá comentando menos el códgo ya que vamos a ir saliendo de lo básico y ya vamos a tener idea de como funcionan las cosas.

2 Responses so far.

  1. Hola amigo excelente tu tutorial, pero recuerda siempre comentar el codigo, es una buena practica de programacion comentar hasta lo mas obvio, cuando otra persona toem el codigo le puede ahorrar bastante tiempo cuando haces modificaciones, incluso al mismo creador.
    Sigue con el tutorial esta bastante bueno y recomendable...

  2. Hola malditosan generalmente los códigos están comentados en casi todas las líneas, como en este caso no es el primer tutorial se asume que algunas cosas se saben ya que en los tutoriales anteriores se explicaron con detalle, igualmente en el código de fuente para bajar están la mayoría de las líneas comentadas.
    En éste tutorial me parece que me falto subir el archivo fuente, pero en cuanto pueda lo subo así no quedan dudas.
    Gracias por tu comentario :)

Deja tu comentario