libGDX: Cuerpos y sprites (imágenes)

En este tutorial vamos a aprender cómo dibujar una imagen en nuestro cuerpo pero antes de comenzar recuerda que puedes descargar el código completo en Github y si lo prefieres puedes ver el video tutorial de este articulo.

También puedes correr la aplicación de este tutorial en tu navegador.

Para comenzar, si tenemos un cuerpo circular que representa una pelota dibujaremos una imagen de una pelota junto con nuestro cuerpo y si tenemos un cuadrado dibujaremos una caja:

Es necesario almacenar la información de los cuerpos para saber exactamente donde vamos a dibujar los sprites para esto vamos a crear una clase GameObject donde voy a guardar el tipo, la posición y el ángulo actual del cuerpo.

static public class GameObject {
	static final int BALL = 0;
	static final int BOX = 1;
	final int type;
	float angleDeg;
	Vector2 position;

	public GameObject(float x, float y, int type) {
		position = new Vector2(x, y);
		this.type = type;
	}

	public void update(Body body) {
		position.x = body.getPosition().x;
		position.y = body.getPosition().y;
		angleDeg = (float) Math.toDegrees(body.getAngle());
	}
}

En el constructor inicializamos la posición inicial y el tipo de objeto (Pelota o Caja). Y la función update va ser llamada cada vez que hagamos una llamada a la función oWorld.step (aproximadamente 60 veces por segundo) y sirve para actualizar la posición y ángulo del objeto.

Siguiendo los tutoriales anteriores vamos a crear el piso, una caja y una pelota por lo que vamos a tener 3 funciones createFloor, createBall, createBox recuerda que puedes descargar el código fuente en github.

También vamos a cargar las imágenes que se utilizarán para representar las pelotas y las cajas.

TextureRegion ball, box;

public Learn5(MainLearn game) {
	super(game);
	//...más código
	ball = new TextureRegion(new 	Texture(Gdx.files.internal("data/pelota.png")));
	box = new TextureRegion(new Texture(Gdx.files.internal("data/caja.png")));
	//...más código
}

En la función update del ejemplo es necesario llamar el update de cada uno de los objetos GameObject:

@Override
public void update(float delta) {
	oWorld.step(delta, 8, 6);
	oWorld.getBodies(arrBodies);

	for (Body body : arrBodies) {
		if (body.getUserData() instanceof GameObject) {
			GameObject obj = (GameObject) body.getUserData();
			obj.update(body);
		}
	}
}

Y lo más importante es en la función draw del ejemplo tenemos que dibujar las pelotas y cajas:

@Override
public void draw(float delta) {
	//...más código
	oCamBox2D.update();

	spriteBatch.setProjectionMatrix(oCamBox2D.combined);
	spriteBatch.begin();

	drawGameObjects();
	spriteBatch.end();
	//...más código
}

private void drawGameObjects() {
	for (GameObject obj : arrGameObjects) {
		TextureRegion keyframe;

		if (obj.type == GameObject.BOX)
			keyframe = box;
		else
			keyframe = ball;

		spriteBatch.draw(keyframe, obj.position.x - .15f,
			obj.position.y - .15f, .15f, .15f, .3f,
			.3f, 1, 1, obj.angleDeg);
	}
}

En la función drawGameObjects iteramos cada uno de los objetos GameObject para obtener su posición, ángulo y tipo para poder dibujarlo correctamente.