Button with image and text

Started by orlysedl, 28 November 2017, 12:55:23

orlysedl

Hi all. Please tell me how to make the button with image is on the left, and behind image is the text of the buttons?  :'(

texus

Such a widget is currently not supported.
You could write it yourself by inheriting from the Button class and changing the draw function.
Alternatively (at least in 0.8-dev, I don't know about 0.7) you could display a picture and a label in front of your button and call ignoreMouseEvents(true) on these widgets so that a click on them occurs on the button behind them. But this means you would have to create 3 widgets for each such button you want to create.

This has been requested before and I'm just finishing up on the stuff I was working on without any concrete plans yet for the next thing to work on, so I'll probably have a look whether I can add such a button in TGUI somewhere this week. If everything goes well it might already be available before the end of the weekend, but I won't guarantees that it will be ready so soon.

texus

I have added a BitmapButton widget to 0.8-dev.
The image can be set with the setImage function and will by default have the size of the texture itself and independent of the button size. If the image size has to depend on the button size, call the setImageScaling function with a number between 0 and 1. The height of the image will be the size of the button multiplied with that number (the width will be changed as well of course to maintain the ratio of the image).

Example:
Code (cpp) Select
auto button = tgui::BitmapButton::create();
button->setText("Text");
button->setImage("image.png");
button->setImageScaling(0.8f);
gui.add(button);