[SFML] Dibujando cosas en 2D

Freyader

Dibujando cosas en 2D

Introducción

Como has aprendido en los tutoriales anteriores, el módulo de ventanas de SFML provee una manera fácil de abrir y trabajar con ventanas, pero no ayuda a dibujar algo sobre ellas. Afortunadamente, SFML provee un módulo de gráficos que te ayudará a crear entidades en 2D.

La ventana de dibujo

Para dibujar entidades utilizando el módulo de gráficos, debes utilzar una clase especializada en ventanas: sf::RenderWindow. Esta clase deriva de sf::Window, y hereda todas sus funciones. Todo lo que has aprendido acerca de sf::Window (creación, manejo de eventos, controlar el framerate, etc.) es aplicable a sf::RenderWindow.

Además de eso sf::RenderWindow añade funciones de alto nivel para ayudar a crear cosas más facilmente. En este tutorial, nos centraremos en dos de esas funciones: clear y draw. Son tan simples como su nombre lo indica: clear, limpia toda la ventana con el color elegido, y draw, dibuja algún objeto en pantalla.

Esto es un típico game loop utilizando RenderWindow:
#include

int main()
{
//Crea la ventana
sf::RenderWindow window(sf::VideoMode(800, 600), "My window");
//Game loop
while (window.isOpen())
{
//Comprueba si se desencadenó algún evento
sf::Event event;
while (window.pollEvent(event))
{
//Si se requiere, cierra la ventana
if (event.type == sf::Event::Closed)
window.close();
}
//Limpia la ventana con color negro
window.clear(sf::Color::Black);
//Dibuja algo aquí
// window.draw(...);
//Actualiza la ventana
window.display();
}
return 0;
}

Es obligación llamar a la función clear antes de dibujar algo, de otra manera quedarán pixeles sin definir del cuadro anterior. La única excepción es cuando cubres la pantalla por completo con un dibujo, de esa forma no quedarán pixeles sin definir; en este caso de igual forma puedes llamar a la función clear (aunque no será una diferencia muy notoria).

Llamas a la función display también es obligación, esta función toma lo que se dibujó desde la última llamada a la función display y lo muestra en la ventana. De echo, las cosas al ser dibujadas, no son dibujadas directamente en la ventana, estas van a un buffer oculto. Este buffer es copiado a la ventana cuando llamas a la función display (se conoce como double-buffering).

Este ciclo de funciones (clear-draw-display) es la única manera óptima de dibujar algo. No intentes de utilizar otras estrategias, como mantener pixeles del cuadro anterior, borrar pixeles, o dibujar una vez y llamando a la función display varias veces. Solo obtendrás resultados extraños debido al double-buffering.
Chipset modernos de gráficos están echos realmente para repetir este ciclo donde todo se actualiza completamente en cada iteración del game loop. No te asusten por ejemplo si dibujas 1000 sprites 60 veces por segundo, estas muy debajo de los millones de triángulos que un equipo común puede soportar.

¿Que puedo dibujar ahora?

Ahora que tienes el game loop completo, estas listo para dibujar, veamos que y como puedes dibujar algo en tu ventana.

SFML provee de cuatro entidades dibujables: tres de ellas están listas para ser usadar (sprites, textos, formas), la última es el bloque constructor que te ayudará a crear tus propias entidades dibujables (vertex arrays).

Aunque comparten algunas propiedades en común, estas entidades tienen propiedades específicas y por ello merecen ser tratadas cada una por separado en otro tutorial.