Cargando Sprites

Bueno, según creo yo, esto es de lo más básico que hay que saber para armar juegos.
Los Sprites, son imagenes que cargamos para nuestro juego, pueden ser pequeñas o grandes, en cualquier formato, a eso me referiré con sprites. Como podrás ver en los juegos, esta lleno de sprites, hay varios métodos para eso, o repitiendo un sprite muchas veces para hacer mapas completos (tiles, lo veremos más adelante) o simplemente cargando una imagen para nuestro personaje principal, o un fondo, en fin, se traduce como "Imagenes".
Si usas NetBeans, vamos a File -> New Project. Elegimos el nombre del proyecto, en este caso yo use
LoadSprites.
NetBeans por default debería crear una clase principal llamada Main, en este caso así se ve la mia

package loadsprites;

/**
*
* @author fede
*/
public class Main {

 /**
  * @param args the command line arguments
  */
 public static void main(String[] args) {
     // TODO code application logic here
 }

}

Muy bien, ahora vamos a importar JFrame, de swing, esto nos permitirá hacer un Frame (ventana).

import javax.swing.JFrame;

Eso va después del package, mas tarde postearé el código completo, por ahora, vamos armandolo. Una vez que importamos el Frame, tenemos que hacer que nuestra clase principal herede de este, asi podemos armar una ventana, logramos eso editando la siguiente línea

public class Main extends JFrame {

Como veran, agregando 'extends' podemos hacer que Main herede de JFrame.
Ahora vamos a hacer un constructor, y en el vamos a especificar algunas cosas de nuestra ventana (Frame)

public Main(){
     setTitle("Loading Sprite"); // Titulo
     setSize(300,300); // Tamaño
     setDefaultCloseOperation(EXIT_ON_CLOSE); // Salir cuando apretamos el boton 'x'
     setLocationRelativeTo(null); // Centrar
     setVisible(true); // Visible
     setResizable(false); // No se puede resizear
 }

El constructor es llamado solo una vez, cuando la clase es instanciada, es usado para especificar valores iniciales, como lo hacemos en este caso.
Finalmente en la funcion main, que es la que se va a ejecutar primero de todas las funciones, llamamos a nuestra clase Main.
Este es el codigo completo de Main.java

package loadsprites;

import javax.swing.JFrame;

/**
*
* @author fede
*/
public class Main extends JFrame {

 public Main(){
     setTitle("Loading Sprite"); // Titulo
     setSize(300,300); // Tamaño
     setDefaultCloseOperation(EXIT_ON_CLOSE); // Salir cuando apretamos el boton 'x'
     setLocationRelativeTo(null); // Centrar
     setVisible(true); // Visible
     setResizable(false); // No se puede resizear
 }

 public static void main(String[] args) {
     new Main();
 }

}

Ahora, si usamos NetBeans, podemos hacer click derecho en el archivo Main.java, y Run. Deberia aparecer nuestra ventana vacia.



Obviamente, como se ve, varia de su sistema operativo y configuracion de apariencia, en mi caso uso Windows XP y un Theme de Windows 7.

Muy bien! Tenemos nuestra ventana vacía, pero falta lo más importante, la imagen, algo importante a resaltar hasta ahora es la clase Main, se repetirá mucho, ya que la ventana en si no varia mucho, lo que modificamos es lo que hay dentro, y eso es en otra clase, que llamaremos Board.

Creamos una nueva clase, llamada Board dentro del mismo package que estemos usando obviamente.

package loadsprites;

import java.awt.Image;
import javax.swing.ImageIcon;

/**
*
* @author fede
*/
public class Board {

}

Pueden ver que importe un par de librerias, Image la usaremos para cargar una imagen, y usar la imagen en si, ImageIcon es para cargar la imagen mas facilmente.

package loadsprites;

import java.awt.Image;
import javax.swing.ImageIcon;

/**
*
* @author fede
*/
public class Board {
  Image image;

  public Board(){
      ImageIcon ii = new ImageIcon(this.getClass().getResource("image.gif"));
      image = ii.getImage();
  }
}

Ahora debería verse asi, ya tenemos la imagen lista para dibujar, solo falta dibujarla ;)
Para eso vamos a importar las librerias Graphics y Graphics2D de awt, y sobreescribir la función paint de JPanel, para eso, tenemos que heredar de JPanel. Veamos...

package loadsprites;

import java.awt.Image;
import java.awt.Graphics;
import java.awt.Graphics2D;
import javax.swing.JPanel;
import javax.swing.ImageIcon;

/**
*
* @author fede
*/
public class Board extends JPanel {
  private Image image;

  public Board(){
      ImageIcon ii = new ImageIcon(this.getClass().getResource("image.png"));
      image = ii.getImage();
  }

  public void paint(Graphics g){
      Graphics2D g2d = (Graphics2D)g; // Convertimos a g de Graphics a Graphics2D
      g2d.drawImage(image, 0, 0, this);
  }
}

Parecen muchas librearias, de hecho lo son, pero...es Java, asi es :P
La verdad a mi no me gusta eso tampoco pero no es tan malo, ni son tantas en realidad. Como veran, heredo de JPanel, hago una variable image privada de tipo Image, luego en el constructor se encarga de llenar esa variable con una imagen. El metodo paint de JPanel es el que se encarga de dibujar, y se llama automaticamente, lo sobreescribimos para dibujar lo que queremos, en este caso una imagen.
Es importante que un archivo "imagen.png" este ubicado en el mismo directorio que Main.java y Board.java, de lo contrario, saldra un error.
Esta clase ya esta terminada, ahora solo nos falta una linea en la clase Main, para poder mostrar la imagen

add(new Board());

La agregamos y queda algo asi

package loadsprites;

import javax.swing.JFrame;

/**
*
* @author fede
*/
public class Main extends JFrame {

  public Main(){
      add(new Board());
      setTitle("Loading Sprite"); // Titulo
      setSize(300,300); // Tamaño
      setDefaultCloseOperation(EXIT_ON_CLOSE); // Salir cuando apretamos el boton 'x'
      setLocationRelativeTo(null); // Centrar
      setVisible(true); // Visible
      setResizable(false); // No se puede resizear
  }

  public static void main(String[] args) {
      new Main();
  }

}

Una vez que tenemos estas clases, ya podemos mostrar la imagen! Solo ejecuten Main.java y veran algo asi (Obviamente, depende de su imagen). Es importante resaltar que java solo soporta imagenes formato PNG.



No nos meteremos mucho mas en lo que es manejo de imagenes ni 2D porque esto es lo que necesitamos basicamente, mas adelante si necesitamos rotar una imagen o algo mas especifico, explicare como pero no le veo sentido a explicar mucho mas sobre ese tema.
Descargar codigo fuente: de 4shared