Using Themes/skins

Using themes

The Theme class is an easy interface to load and store the renderers. The renderers will be what actually defines how the the widgets will look, the theme is just responsible for loading and storing them.

By default, the theme will load renderers from a file which you can specify either when constructing the instance or later on by calling the load function.

Theme blackTheme{"TGUI/widgets/Black.txt"};

Theme greyTheme;

Technically, it is actually an internal DefaultThemeLoader that handles the loading and you could specify a custom theme loader, but that is not something the average user will need to worry about.

After the file has been parsed, you can access the renderers that were loaded by their id, which is their name in the loaded file. In the themes that ship with TGUI, the name of the renderer corresponds with the name of the widget. So if you want to use the black skin for your edit box instead of the default white one then just add the following line to your code:


Note that the names are always case-insensitive, it won't make a difference if you pass "editbox", "EditBox" or "EDITBOX" to the getRenderer function.

Adding and removing renderers manually

The load function will add renderers to the theme, but you can also add renderers to the theme yourself:

theme.addRenderer("RendererName", widget->getRenderer());

In a similar fashion you can remove renderers from a theme:


Reloading themes

One cool thing that you can do with themes is reloading all widgets that are using renderers from that theme. Say for instance that you have loaded all widgets with the Black skin and you want all of these widgets to use the BabyBlue skin. This is as simple as calling the load function again:

Theme theme{"TGUI/widgets/Black.txt"};
button->setRenderer(theme.getRenderer("Button")); // Button changes from White to Black skin
theme.load("TGUI/widgets/BabyBlue.txt"); // Button changes from Black to BabyBlue skin