SFML 2: Fuentes y textos

En este artículo veremos como tratar fuentes y textos en SFML 2. Las fuentes y los textos funcionan de forma parecida a las texturas y los sprites que vimos en el artículo anterior.

Las fuentes tipográfica es el recurso que se debe cargar desde una memoria secundaria (Disco duro, pendrive, etc.) y el texto es un objeto que tiene la propiedad de ser dibujable y transformable al igual que los sprites. Aparte de las características de estos los textos añaden otras como el tamaño de los caracteres, uso de strings y más añadidos propios de un texto. Lo mejor siempre es ver un ejemplo de código comentado paso a paso.

	#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 un objeto fuente
	sf::Font fuente;
	// Intentamos cargarla
	if (!fuente.loadFromFile("data/OpenSans.ttf"))
	{
	return EXIT_FAILURE;
	}

	// Creamos un objeto texto
	sf::Text texto;
	// Creamos un objeto String
	sf::String cadena;
	// Damos un valor a la cadena
	cadena = "Hola Mundo";
	// Asignamos la cadena al texto
	texto.setString(cadena);
	// Asignamos la fuente que hemos cargado al texto
	texto.setFont(fuente);
	// Tamaño de la fuente
	texto.setCharacterSize(40);
	// Posición del texto
	texto.setPosition(400, 300);
	// Lo rotamos un poco
	texto.rotate(20);

	// Creamos otro texto con la misma fuente
	sf::Text otro_texto("GenbetaDev Mola", fuente, 32);
	// Cambiamos el origen
	otro_texto.setOrigin(otro_texto.getLocalBounds().width/2, 0);
	// Cambiamos la posicion
	otro_texto.setPosition(640/2, 20);
	// Cambiamos el color
	otro_texto.setColor(sf::Color(255, 0, 0));

	// 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(texto);
	window.draw(otro_texto);

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

	return 0;
	}

view raw sfml_texto.cpp hosted with ❤ by GitHub

Como vemos cargamos una sola fuente y creamos dos textos diferentes con ella. Atención especial a como podemos construirlo de varias maneras en el primero creamos el objeto texto y luego le asignamos a través de sus métodos una cadena, un tamaño y una fuente. Por el contrario en el segundo aprovechamos el constructor para definir estos parámetros.

Este sería el resultado de nuestro programa: