Moviendo el sprite

Es tiempo de hacer algunos cambios a nuestra app para empezar a tener un juego como tal. Primero vamos a cambiar el tamaño de nuestra ventana donde el jugador va a actuar.

Cambiando el tamaño de la pantalla

Cambiar el tamaño de la pantalla es bien fácil, solo necesitamos usar GraphicsDeviceManager en nuestra clase Game1. En el contructor de la clase, vamos a agregar las siguientes líneas

Si corres el juego, verás una ventana con el tamaño que nosotros le pasamos.

Agregando un dondo y posicionando al jugador en el lugar correcto

Ahora necesitamos poner un background para empezar a ver a nuestro juego como queremos. Después de este punto, vamos a comenzar con el gameplay real, así que este es un paso emocionante.

Primero necesitamos agregar el fondo de desierto (cambia el nombre del fondo, para que sea más fácil agregarlo, además de que ya me di cuenta de que estaba mal escrito, ponle de nombre “background” para una fácil referencia.

Con el arte en nuestra carpeta Content, es tiempo de agregarlo a nuestro juego. Debido que vamos a utilzar la altura y anchura de nuestra pantalla en muchas partes del código, quiero agregar una variable para no tener ningún número mágico volando por ahí, así que enl a clase Game1 vamos a agregar dos variables

Ahora, necesitamos inicializar nuestro Rectángulo y luego usar la variable screenRectangle para reemplazar los números mágicos

Ahora, tenemos que cargar nuestro background, agrega este código al método LoadContent

Y finalmente, necesitamos dibujar nuestro fondo.

Es muy importante el orden en que dibujamos nuestros objetos, porque el primero es dibujado antes que el siguiente.

Si corremos nuestro proyecto, deberías de ver esto

Cambiando al jugador al lugar correcto

Con el background en su lugar, es tiempo de cambiar nuestra clase Player2D para posicionar a nuestro jugador en el fondo y que ya no se meuva automáticamente.

Primero, necesitamos cambiar nuestra clase Player2D, tenemos la variable playerSprite como privado, necesitamos cambiarlo a una propiedad pública porque vamos a necesitar la posición de nuestro sprite, así que hagamos eso

Ahora cambiemos todas las referencias de playerSprite en el documento por PlayerSprite

Luego, cambiemos la dirección por defecto a 0

Necesitamos remover la posición por default, ya que esta posición la vamos a poner en la clase Game1. En el método Initialize debe quedar así

Ahora, en el método Update, necesitamos remover todas estas líneas porque ahora vamos a usar el teclado para mover al jugador

En la clase Game1, necesitamos decirle a nuestro sprite donde va a estar cuando el juego se cargue.

En el método Initialize de esta clase, agregemos el siguiente código depués de la inicialización de  playerSprite

Lo que hicimos fue agregar un Vector2 ya que no tenemos acceso a la altura y anchura de nuestro sprite, ya que no ha sido cargado, solo inicializado. Luego, pusimos la posicion de nuestro

sprite en el centro y el fondo de nuestra pantalla, haciendo uso de la variable screenRectangle y algunas sencillas operaciones matemáticas.

Corre el proyecto para ver esto

Moviendo el sprite con el teclado

Luego de todo en su sitio, es hora de empezar a mover a nuestro jugador con el teclado. Esto es hecho en el método Update de la clase Player2D.

Por ahora, solo vamos a mover al jugador a la derecha o izquierda.

Primero, necesitamos una forma de obtener el estado de nuestro teclado, y MonoGame nos provee con una clase para realizar esto. Necesitamos agregar un nuevo using

Ahora, necesitamos agregar una variable privada para obtener el estado del teclado

Luego, necesitamos cambiar el método Update

  1. Primero, necesitamos obtener el estado actual del teclado, necesitamos esto porque MonoGame checa cuando una tecla es presionada o liberada
  2. MonoGame nos provee con utilidades para obtener una tecla del teclado, así que checamos si presionamos la flecha derecha o izquiera. Si la presionamos, entonces ponemos la dirección a como lo habíamos hecho antes
  3. Esto no cambia, solo ponemos la posición del sprite usando la dirección y velocidad
  4. Necesitamos hacer algunos cálculos para que el jugador no se salga de la pantalla, con unos cálculos checamos si se va más allá del total del ancho o si por el contrario es menos que el inicio de la pantalla, que es 0
  5. Después de checar las posiciones, ponemos la posición del sprite
  6. Al final, le ponemos la dirección 0 para que deje de moverse si el jugador ha dejado de presionar

Si corres el proyecto, notarás que el jugador se está moviendo muy lentamente, esto es porque pusimos la velocidad en 60, y esto hace que se mueva 1 pixel por segundo cuando está corriendo a 60 FPS nuestro juego. Para que vaya más rápido, mueve la velocidad a un número que te haga más sentido, probando cual sientes que es lo mejor, yo le puse 250, pero tu puedes ponerle más o menos, ¡total, es tu juego!

Resumiendo

Hemos hecho nuestros primeros pasos para nuestro juego, ahora si con interacción del usuario. Por ahora, vamos a ir agregando más diversión al juego y crear nuestro shooter espacial.

Puedes ver todo el código hasta ahora en mi Github