Grid with padding with non-default font size works incorrectly

Started by Kvaz1r, 03 August 2021, 12:53:16

Kvaz1r

When both (padding and text size) are setting not to default value hovering on EditBox works incorrectly.

MCVE:

#include <TGUI/TGUI.hpp>

class MyFrame : public sf::RenderWindow
{
public:
    MyFrame(sf::RenderWindow& w, tgui::Gui& g);
    void main();

private:
    sf::RenderWindow& window;
    tgui::Gui& gui;

    const std::size_t nRows = 2;
    const std::size_t nCols = 3;

    std::vector<tgui::EditBox::Ptr> m_widgets;
    tgui::Grid::Ptr m_grid;
};

MyFrame::MyFrame(sf::RenderWindow& w, tgui::Gui& g) : window(w), gui(g)
{
    auto panel = tgui::Panel::create();
    m_grid = tgui::Grid::create();

    m_grid->setPosition({ 0,25 });
    m_grid->setSize({ "100%","20%" });

    std::vector<tgui::String> labels = { L"1",L"2",L"3" };

    tgui::Padding padding = { 0,25,0,0 };

    for (std::size_t i = 0; i < nRows; i++)
    {
        if (i > 0)
        {
            for (std::size_t j = 0; j < nCols; j++)
            {
                auto widget = tgui::EditBox::create();
                widget->setText(labels[j]);
                widget->getRenderer()->setBackgroundColorHover(tgui::Color::Cyan);
                m_grid->addWidget(widget, i, j, tgui::Grid::Alignment::Center, padding);
                m_widgets.push_back(widget);
            }
        }
        else
        {
            for (std::size_t j = 0; j < nCols; j++)
            {
                auto widget = tgui::Label::create(labels[j]);
                m_grid->addWidget(widget, i, j, tgui::Grid::Alignment::Center, padding);
            }
        }
    }

    panel->add(m_grid);
    gui.add(panel);
}

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

            gui.handleEvent(event);
        }
        window.clear();
        gui.draw();
        window.display();
    }
}

int main()
{
    // Create the window
    sf::RenderWindow window(sf::VideoMode(800, 400), "MCVE");
    window.setFramerateLimit(60);
    tgui::Gui gui(window);
    gui.setTextSize(20);
    MyFrame(window, gui).main();

    return EXIT_SUCCESS;
}

texus

I'm not sure what the best fix would be for this case.

The height of the grid is set to 20% of the panel, which fills the window (which has a height of 400 pixels), thus the grid only has a height of 80 pixels.

You are adding 25px padding above the labels and between label and edit box.
With a character size of 20, the label has a height of 27px and the edit box of 22px.
The total height of both rows is thus 99px.

The hover only looks at the top 80px because it considers everything else to be outside the grid, while the rendering doesn't perform any clipping and thus renders the last 19px as well even though they lie outside the grid.
The most correct solution based on the current code would actually be to add clipping to the rendering and not draw the bottom part of the edit boxes.

Kvaz1r

Quote from: texus on 03 August 2021, 18:32:20
The hover only looks at the top 80px because it considers everything else to be outside the grid, while the rendering doesn't perform any clipping and thus renders the last 19px as well even though they lie outside the grid.
The most correct solution based on the current code would actually be to add clipping to the rendering and not draw the bottom part of the edit boxes.

Thanks, got it. I agree that rendering clipping would be useful for avoiding such behaviour - it'd made mistake obvious.
Or optional(?) assert with checking. In that case it won't break current behaviour, but still will be helpful.