Changing QProgressBar background-color does not work

Question

I'm creating a Qt widget application.

In Qt Designer, my QProgressBar looks like this:

I set different colors for background and chunk, but when I run my application, background-color doesn't show properly:

I set the following stylesheet:

#progressBar {
color: rgb(180,180,180);
background-color: rgb(100,200,100);
text-align: center;
font-size: 24px;
}
#progressBar::chunk {
background-color: rgb(10,150,0);
}

I'm using:

• Qt version: 6.3.1
• OS: Windows

How can I fix it?

Answer 1

background-color does not seem to work with QProgressBar on Windows using Windows style, it appears to only affect its text background if not aligned:

#include <QApplication>
#include <QtWidgets>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);

    QProgressBar p;

    p.setObjectName("progressBar");
    p.setStyleSheet("#progressBar"
                    "{"
                        "background: rgb(100,200,100);"
                    "}");

    p.setRange(0,100);
    p.setValue(40);
    p.show();

    return a.exec();
}

---

One possible workaround is to set the QProgressBar style to Fusion:

#include <QApplication>
#include <QtWidgets>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);

    QProgressBar p;

    p.setStyle(QStyleFactory::create("Fusion"));

    p.setObjectName("progressBar");
    p.setStyleSheet("#progressBar"
                    "{"
                        "color: rgb(180,180,180);"
                        "background-color: rgb(100,200,100);"
                        "text-align: center;"
                        "font-size: 24px;"
                    "}"
                    "#progressBar::chunk "
                    "{"
                        "background-color: rgb(10,150,0);"
                    "}");
    p.setRange(0,100);
    p.setValue(90);

    p.show();

    return a.exec();
}