Starting with TGUI

There are five things you need to change in your code to get tgui working.
The first thing to do is including it. TGUI will include “SFML/Graphics.hpp” for you.

#include <TGUI/TGUI.hpp>

The next thing to do is creating a window. The window that is provided in tgui is just a wrapper around sf::RenderWindow, so all of its functions are kept. This means that you can call the constructor in the same way. (See lower for an alternative to tgui::Window).

tgui::Window window(sf::VideoMode(800, 600, 32), "TGUI Window");

Since sfml no longer provides a default font, you will have to set your own font.

window.globalFont.loadFromFile("TGUI/Fonts/DejaVuSans.ttf"); // Load the font directly
window.globalFont = font; // or make a copy of a font that you had already loaded

When you will have objects, they will need to receive events. Otherwise they wouldn’t know if your mouse is on top of them or not. Every time you receive an event, you will have to tell the window about this event. So in your event loop you must add the following line:

window.handleEvent(event);

The last thing to do is drawing the object on the screen. For this you must call the drawGUI function of the window. All object will be drawn on the screen in the order that you created them. So if your objects overlap each other then the last created object will be drawn in front.

window.drawGUI();

So the full code will look like this:

#include <TGUI/TGUI.hpp>

int main()
{
    // Create the window
    tgui::Window window(sf::VideoMode(800, 600), "TGUI window");

    // Load the font (you should check the return value to make sure that it is loaded)
    window.globalFont.loadFromFile("TGUI/Fonts/DejaVuSans.ttf");

    while (window.isOpen())
    {
        sf::Event event;
        while (window.pollEvent(event))
        {
            if (event.type == sf::Event::Closed)
                window.close();

            // Pass the event to all the objects (if there would be objects)
            window.handleEvent(event);
        }

        window.clear();

        // Draw all created objects
        window.drawGUI();

        window.display();
    }

    return EXIT_SUCCESS;
}

Alternative to tgui::Window

In some cases you might not want to use tgui::Window. This could be just out of personal preference or because you need to override sf::RenderWindow yourself.

In this case you can make use of the Form struct.

#include <TGUI/TGUI.hpp>

int main()
{
    // Create both sfml and tgui windows
    // Unlike with tgui::Window, sfml and tgui calls are now split.
    sf::RenderWindow window(sf::VideoMode(800, 600), "TGUI window");
    tgui::Form tguiWindow(window);

    // Load the font
    tguiWindow.globalFont.loadFromFile("TGUI/Fonts/DejaVuSans.ttf");

    while (window.isOpen())
    {
        sf::Event event;
        while (window.pollEvent(event))
        {
            if (event.type == sf::Event::Closed)
                window.close();

            // Pass the event to all the object
            tguiWindow.handleEvent(event);
        }

        window.clear();

        // Draw all created objects
        // Note that the function is called draw instead of drawGUI like in tgui::Window.
        tguiWindow.draw();

        window.display();
    }

    return EXIT_SUCCESS;
}

Next: Working with objects