John Tan
John Tan

Reputation: 1385

Qt QPushButton changes size when checked is enabled

I have two QPushButton on a QGridLayout, with one button checked and the other unchecked:

class MyFrame : QFrame()
{
    MyFrame() { init(); }

    void init()
    {
        setStyleSheet("QPushButton {background-color:#292929; color: white;} QPushButton:hover {background-color: #505050; color: white;} QPushButton:pressed{background-color: #F79862;} QPushButton:checked{background-color: #F79862;border:none;} QToolTip{ color: #404040; }");

        auto layout = new QGridLayout();
        auto btn1 = new QPushButton("btn1");
        auto btn2 = new QPushButton("btn2");

        btn1->setCheckable(true);
        btn2->setCheckable(true);

        btn1->setChecked(false);
        btn2->setChecked(true);

        layout->addWidget(btn1, 0, 0, 1, 1);
        layout->addWidget(btn2, 0, 1, 1, 1);
    }
}

QVBoxLayout* grid = new QVBoxLayout();
MyFrame* myFrame = new MyFrame();
grid->addWidget(myFrame);

However, when i run the program, one of the button appears to be bigger than the other. What can I do to make the button size similar?

enter image description here

I am using Qt 5.11.2.

Upvotes: 0

Views: 159

Answers (1)

Silvano Cerza
Silvano Cerza

Reputation: 970

The issue is in your styleSheet, just remove border:none; from QPushButton:checked.

setStyleSheet("QPushButton {"
              "   background-color:#292929; "
              "   color: white;"
              "} "
              ""
              "QPushButton:hover {"
              "   background-color: #505050; "
              "   color: white;"
              "} "
              ""
              "QPushButton:pressed {"
              "   background-color: #F79862;"
              "} "
              ""
              "QPushButton:checked {"
              "   background-color: #F79862;"
              "} "
              ""
              "QToolTip { "
              "   color: #404040; "
              "}");

This is the result:

Solution image

Upvotes: 1

Related Questions