Inicio > Games, Tips, XNA > [Tips – XNA] Cargar un Sprite y Animarlo (parte 1)

[Tips – XNA] Cargar un Sprite y Animarlo (parte 1)

Bien, lo primero es declarar las variables necesarias, que son la Textura2D que contendrá nuestra imagen y el Vector2D para la posición de nuestro camino, es decir; en donde lo colocaremos. La declaración serán vectores, ya que lo cargaremos más de una vez y lo dibujaremos por igual. La declaración queda así:

//varibales del camino
       Texture2D[] Camino = new Texture2D[2];
       Vector2[] posCamino = new Vector2[2];

Después seguimos con el proceso de cargar nuestro Sprite, que se realiza dentro del método protected override void LoadContent(), lo que hacemos aquí es cargar el sprite pero dentro de un bucle for, para que lo carguemos más de una vez y cada vez lo coloquemos en posiciones diferentes, el código dentro del método LoadContent() va así:

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
      for (int i = 0; i < 2; i++)
      {
          Camino[i] = Content.Load<Texture2D>("camino");
      }
      posCamino[0] = Vector2.Zero;
      posCamino[1] = new Vector2(0, -600);
}

De esta manera tenemos 2 veces la textura y la colocaremos en diferentes posiciones, esto con el fin simular el movimiento de nuestro Sprite, que en el caso es un camino.

Para poder simular el movimiento de un camino, como es nuestro caso necesitamos un método que realice esta función, el cual llamaremos MueveCamino() y este contiene lo siguiente:

private void MueveCamino()
        {
            int vel = 6;//velocidad a la que se mueve el camino
            int max = graphics.PreferredBackBufferHeight; // indica el maximo en el alto

            for (int j = 0; j < 2; j++)
            {
                //inidicamos la vel en el eje Y
                posCamino[j].Y += vel;
                //si llega al maximo que se regrese, todo sobre el eje Y
                if (posCamino[j].Y > max)
                    posCamino[j].Y = -591;
            }
        }

Tenemos que tomar en cuenta que este método debe ser llamado, por el método principal de protected override void Update(GameTime gameTime, para que dicha simulación pueda ocurrir, entonces nuestro método Update(), queda así:

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
            MueveCamino();
            base.Update(gameTime);
        }

Ahora solo nos resta dibujar nuestros Sprites, y esto lo hacemos dentro del método protected override void Draw(GameTime gameTime), y como ya sabemos para esto necesitamos nuestra varibale de spriteBatch que se declara automáticamente al inico del proyecto.

Existen tres métodos que utilizaremos dentro del spriteBatch, que son: Begin(), Draw() y End() que como sus nombres los dicen, sirve para iniciar, dibujar y terminar, en nuestro caso al momento de dibujar, también lo haremos dentro de un for, esto para que lo dibujen un par de veces y simular el movimiento del camino. El método Draw(), queda así:

protected override void Draw(GameTime gameTime)
        {
            graphics.GraphicsDevice.Clear(Color.CornflowerBlue);

            // TODO: Add your drawing code here
            spriteBatch.Begin(SpriteBlendMode.AlphaBlend);
            for (int i = 0; i < 2; i++)
                spriteBatch.Draw(Camino[i], posCamino[i], Color.White);
            spriteBatch.End();

            base.Draw(gameTime);
        }

Ya por ultimo compilamos y ejecutamos, ahora se carga nuestro Sprite y además de todo tiene movimiento, se ve algo así:

         camino

Ahora nos vemos en el siguiente, Tip, que será el como agregar el auto, para luego manipular el estado del teclado.🙂

Categorías:Games, Tips, XNA
  1. junio 11, 2008 a las 5:01 pm

    Hola,
    Gracias por el artículo está bueno pero me da un error al intentar sobreescribir el método loadContent ya que la variable “camino” que supongo es una textura 2D que està en la carpeta content verdad????

    Disculpas soy nuevo en XNA

    Gracias por su ayuda

  2. junio 12, 2008 a las 3:09 pm

    que tal maury004!

    ps no veo porque el error, solo modifico lo que hay dentron del metodo, ya q esto lo hago dentro de la clase de Game.cs que me crea al iniciar un nuevo proyecto no debe marcar error alguno, quiza por la version, este ejemplo es con la version 2.0 y si la textura de “camino” es en 2D y esta dentro de la carpeta Content.

    Aun me falta por subir las otras partes de este pequeño juego, antes del fin de semana lo termino, y subo el fichero para q lo descargues y lo cheques ok.
    Saludos!!

  3. Roberto Rosario
    mayo 7, 2010 a las 6:53 pm

    la imagen la hice de 500X372 y al ejecutar el programa me salen dos figuras unidas y el siguiete par de figuras separadas por un espacio como de 100 pixeles, ¿cuál es el problema?, soy nuevo en esto

  1. No trackbacks yet.

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s

A %d blogueros les gusta esto: