SFML 2: Sprites y texturas

LLegamos al artículo de la serie sobre la biblioteca SFML 2 que muchos estaban esperando, es la hora de abordar el manejo de gráfico de la biblioteca empezando por los sprites y texturas. Veremos las diferencias entre un sprite y una textura y como manejarlos correctamente.

Preparando SFML para usar el modo gráfico

En esta ocasión vamos a empezar usando una ventana de RenderWindow en lugar de una Window es una clase que hereda de esta última y está preparada para dibujar.

	#include <SFML/Graphics.hpp>

	int main()
	{
	// Crea una ventana de 640x480x32 con el título SFML window
	sf::RenderWindow window(sf::VideoMode(640, 480, 32), "SFML window");

	// Activa la sincronización vertical (60 fps)
	window.setVerticalSyncEnabled(true);

	// Game Loop mientras la ventana esté abierta
	while (window.isOpen())
	{
	// Creamos un objeto evento
	sf::Event event;
	// Procesamos la pila de eventos
	while (window.pollEvent(event))
	{
	// Si el evento es de tipo Closed cerramos la ventana
	if (event.type == sf::Event::Closed)
	window.close();
	}

	// Limpiamos la pantalla
	window.clear(sf::Color(180, 200, 255));

	// Actualizamos la ventana
	window.display();
	}

	return EXIT_SUCCESS;
	}

view raw renderwindow.cpp hosted with ❤ by GitHub

Como vemos lo primero es usar el modulo Graphics de SFML a continuación todos es igual con la salvedad que las RenderWindow tienen algunas opciones más que las Window como por ejemplo el método clear que limpia la ventana con el color pasado por parámetro.

Set de recursos

Antes de seguir vamos a descargar la carpeta data y la vamos a descomprimir en la carpeta bin de nuestro proyecto (en la que se encuentra el ejecutable). Esta carpeta contiene un pack de recursos libres para hacer nuestras pruebas.

Texturas y Sprites

En SFML el concepto de textura y Sprite está muy bien hecho y se separa en dos objetos una textura no es más que una imagen cargada en la tarjeta gráfica del ordenador y un sprite usa esta textura pero no es exclusiva de él. Puede haber muchos sprites que usan una misma textura ahorrando tener que cargar varias imagenes desperdiciando memoria. Veamos un ejemplo de como cargar una textura, crear un sprite y manipularlo.

	#include <SFML/Graphics.hpp>
	#include <iostream>

	int main()
	{
	// Crea una ventana de 640x480x32 con el título SFML window
	sf::RenderWindow window(sf::VideoMode(640, 480, 32), "SFML window");

	// Activa la sincronización vertical (60 fps)
	window.setVerticalSyncEnabled(true);

	// Creamos una textura
	sf::Texture textura;

	// Cargamos la textura desde un archivo
	if(!textura.loadFromFile("data/indiana.png"))
	{
	// Si hay un error salimos
	return EXIT_FAILURE;
	}

	// Creamos un sprite
	sf::Sprite sprite;
	// Asignamos la textura al sprite
	sprite.setTexture(textura);
	// Seleccionamos solo un rectangulo de la textura
	sprite.setTextureRect(sf::IntRect(0, 0, 64, 64));
	// Movemos el sprite
	sprite.move(50, 100);
	// Cambiamos el origen al centro del sprite
	sf::Vector2f centro;
	centro.x = sprite.getTextureRect().width / 2.f;
	centro.y = sprite.getTextureRect().height / 2.f;
	sprite.setOrigin(centro);
	// Rotamos el sprite 45 grados
	sprite.rotate(45);


	// Creamos otro sprite con la MISMA textura
	sf::Sprite otro(textura);
	otro.setPosition(200, 150);
	otro.setTextureRect(sf::IntRect(128, 128, 64, 64));

	// Game Loop mientras la ventana esté abierta
	while (window.isOpen())
	{
	// Creamos un objeto evento
	sf::Event event;
	// Procesamos la pila de eventos
	while (window.pollEvent(event))
	{
	// Si el evento es de tipo Closed cerramos la ventana
	if (event.type == sf::Event::Closed)
	window.close();
	}

	// Limpiamos la pantalla
	window.clear(sf::Color(180, 200, 255));

	// Dibujamos en pantalla
	window.draw(sprite);
	window.draw(otro);

	// Actualizamos la ventana
	window.display();
	}

	return 0;
	}

view raw sfml_texturas.cpp hosted with ❤ by GitHub

Como vemos solo cargamos una textura, pero creamos dos sprites con ellas. Podemos coger dos trozos diferentes y manipularlas como queramos como podemos ver en el ejemplo.

En Genbeta Dev | Artíclos anteriores de SFML 2 Más información | Documentación de SFML 2