tgui::Button::Ptr button(gui); button size

Started by Honor, 25 September 2013, 07:30:15

Honor

I want to put a image of a button on my GUI without stretching it. It always ends up stretched though, any solutions?


tgui::Button::Ptr button(gui);
    button->load("gfx/GUI.conf");
    button->setSize(120, 39);
    button->setPosition(630, 250);
    button->setText("Login");
    button->setTextSize(14);
    button->setTextColor(sf::Color(255, 255, 255));
    button->bindCallback(tgui::Button::LeftMouseClicked);
    button->setCallbackId(1);



Button:
    NormalImage_L  = "gui/button/Normal.png" (0, 0, 9, 39)
    NormalImage_M  = "gui/button/Normal.png" (10, 0, 100, 39)
    NormalImage_R  = "gui/button/Normal.png" (111, 0, 9, 39)
    HoverImage_L   = "gui/button/Hover.png"  (0, 0, 9, 39)
    HoverImage_M   = "gui/button/Hover.png"  (10, 0, 100, 39)
    HoverImage_R   = "gui/button/Hover.png"  (111, 0, 9, 39)
    DownImage_L    = "gui/button/Down.png"   (0, 0, 9, 39)
    DownImage_M    = "gui/button/Down.png"   (10, 0, 100, 39)
    DownImage_R    = "gui/button/Down.png"   (111, 0, 9, 39)
   
    TextColor          = (100, 100, 100)
    SeparateHoverImage = true

texus

Can you also send me the image so that I can test it for myself?

Honor


texus

I have attached the output of what I get when using your code and config file.

Could you explain the problem in more detail, because I don't see anything wrong.

Honor

Please pay attention to the "Down.png" file. It uses a pattern over the actual image. When you click on it, the image is stretched.

texus

#5
I see.
But I can't fix that at this point.

SplitImage is added so that you can have buttons with rounded corners, or special corners like yours, so that they don't get stretched. What actually happens is that the left and right image get drawn at the normal size, but the middle image is stretched to fill the whole image.

What you want is that I draw the middle image multiple times instead of stretching it to fill the button. I looked into the possibility, but it requires me to rewrite an important part of the code which I am not going to do short before the release of v0.6. And even if I could change it, I probably don't have the time for it.

I wish I could help, but I cannot make the change now, it will probably be something for v0.6.x.
University has started again, so I can't really make any promises about progress until the end of June.


Edit: I will have the possibility to try changing my code this weekend, but I make no guarantees.
I'm planning on launching the v0.6-beta version at the end this weekend. If the fix isn't in that version then you shouldn't expect it anymore (in the near future).

texus

I have done some tests and you will have your solution tomorrow, worst case on sunday.

The texture coordinates in GUI.conf are slightly off though. You will need this to get the desired effect.
    NormalImage_L  = "Normal.png" (0, 0, 10, 39)
    NormalImage_M  = "Normal.png" (10, 0, 100, 39)
    NormalImage_R  = "Normal.png" (110, 0, 10, 39)
    HoverImage_L   = "Hover.png"  (0, 0, 10, 39)
    HoverImage_M   = "Hover.png"  (10, 0, 100, 39)
    HoverImage_R   = "Hover.png"  (110, 0, 10, 39)
    DownImage_L    = "Down.png"   (0, 0, 10, 39)
    DownImage_M    = "Down.png"   (10, 0, 100, 39)
    DownImage_R    = "Down.png"   (110, 0, 10, 39)


I have attached a preview of what the button will look like after I make the changes and when you put the above lines in your config file.

texus

The changes have been made. Your image will no longer be stretched with the latest version.