TGUI: GUI library for SFML

[texus]

TGUI: Texus' Graphical User Interface

Easy to use
TGUI aims to be easy to use, with only a few lines you have a fully functioning TextBox on your screen.

tgui::TextBox::Ptr textbox = tgui::TextBox::create();
textbox->setPosition(100, 50);
textbox->setSize(300, 200);
textbox->setTextSize(16);
gui.add(textbox);

Customizable
The widgets can be created by just using colors or by using images, making the look very customizable.
When widgets are created without a theme then they will use the build-in white theme (top left image). TGUI also ships with ready to use Black and BabyBlue themes (top right and bottom right images).


(click images for larger version)


Cross-platform
TGUI tries to support the same operating systems as SFML, so it supports Windows, Linux, Mac OS X and FreeBSD and provides experimental support for Raspberry Pi, Android and iOS.


Installation tutorials are available for each of these systems.


Gui Builder
A Gui Builder is included to allow easily creating and editing forms.



Relative sizes and positions
Next to passing absolute values, you can specify positions and sizes relative to the parent.

checkbox->setPosition("30%", "20%");
editBox->setSize(400, "5%");

The widget position and size will automatically update when its parent resizes.




More information
For more information about the project, check the website which has tutorials, documentation and a few example codes. Source code can be found on GitHub.

If you have problems with getting tgui to work or if you find bugs then please open a topic on the TGUI forum.


Some images
 

 

[AxiomsofDominion]

I use TGUI for my current project and I'm pretty satisfied with v0.7-alpha1. No errors or any stability issues so far.

[AlexAUT]

I used it quite some time ago and it was a great experience 

The only thing missing in my opinion are "layer/panel transition" effects like fadeIn fadeOut, swingIn/Out etc. They are not hard to implement as a user of the libary, nevertheless it would be a cool feature built into the library



AlexAUT

[texus]

I wouldn't really expect things like fading to be part of a gui library. But it seems to exist in wxWidgets.
I guess I could add showWithEffect and hideWithEffect to widgets (or even just add some optional parameters for the already existing show and hide functions), I'll look into it for the beta release or perhaps even already for alpha2.

[JackPS9]

Well this UI library has what I need clickable images so, will probably switch over to using this one.

[texus]

The only thing missing in my opinion are "layer/panel transition" effects like fadeIn fadeOut, swingIn/Out etc. They are not hard to implement as a user of the libary, nevertheless it would be a cool feature built into the library

Animations on show or hide have now been added to

How to use it:

button->showWithEffect(tgui::ShowAnimationType::Fade, sf::milliseconds(500));

I'm planning on redesigning the animation class and moving it to the public interface in the future so that you can e.g. move a widget from one spot to another, but for now the animation class can only be accessed indirectly with the showWithEffect and hideWithEffect functions.

[AlexAUT]

Looks nice 

You could get some ideas from this https://github.com/libgdx/libgdx/wiki/Scene2d#actions which is in my opinion a easy to use and flexible API.



AlexAUT

[Blasphemer]

I am using it in my project, its simple to integrate, easy to use and it works very well. Keep up the great work. 

[JackPS9]

Any chance of you adding a way to change a picture, after one has already been loaded to a picture widget?
Asking cause I would love to gray out unable clickables till requirements have been met.

[texus]

I'll add a setTexture function to the Picture class in 0.7-alpha2 which should be released this weekend.

[JackPS9]

I'll add a setTexture function to the Picture class in 0.7-alpha2 which should be released this weekend.

Sweet thanks.  This should be alot more useful then me disabling and hiding the pictures instead like I currently am.

[texus]

TGUI 0.7-alpha2 has been released

Tool Tip
A tool tips can now be any widget and is no longer limited to a simple text. Check the tool tip tutorial for more info.


Show/Hide animations
You can use showWithEffect or hideWithEffect to make widgets appear or dissapear by fading or by sliding from the sides.


New theme
A TransparentGrey theme was added, I don't have any screenshots of it though. All widgets are semi-transparent in this theme and only use colors (no images).

Other changes
- The HorizontalLayout and VerticalLayout classes were fixed so you can now use them to stack your widgets next to each other or below each other.

- A setOpacity function was added which allows giving any widget a certain transparency (without the limitations of the old setTransparency function).

- Text auto-sizing was improved


There will be no more releases for some time, don't expect the beta release before July/August next year. An alpha3 version will only be released if important bugs are found before then.

[AlexAUT]

Nice and thanks for the implementation of the Animations!

Can't wait to use it in my next project



AlexAUT

[JackPS9]

So let me get this right for this new version
tgui::blah::Ptr = theme->load()  instead of  tgui:blah::Ptr wtf(*gui)
and now have to add the parts to the gui

[texus]

If they are loaded from a theme file, yes.

The following two lines from v0.6:

tgui::Button::Ptr button(gui);
button->load("TGUI/widgets/Black.conf");

have basically been replaced with this in v0.7:

tgui::Button::Ptr button = theme->load("button");
gui.add(button);

Basically the same amount of code, but things get executed in a different order.

But some widgets don't have a theme (like Picture and Panel) and are loaded like below. Any widget can actually be loaded like this in which case it will just use the build-in White theme.

tgui::Xyz::Ptr widget = std::make_shared<tgui::Xyz>(/* optional parameters e.g. filename for Picture */);
gui.add(widget);