Specifying Color for progress bar in QProgressBar
-
Hello all,
I am trying to find a way to change the color of the progress bar in QProgressBar. I tried this code snippet here:
QPalette p = this->palette(); p.setColor(QPalette::Highlight, QColor(Qt::green)); this->setPalette(p);
However, this did not work.
I would need to change the colors dynamically so I wouldn't like to use stylesheets. I feel that I need to override the paint function but I am not sure.
I will consider stylesheets as a last resort.
-
Hello all,
I am trying to find a way to change the color of the progress bar in QProgressBar. I tried this code snippet here:
QPalette p = this->palette(); p.setColor(QPalette::Highlight, QColor(Qt::green)); this->setPalette(p);
However, this did not work.
I would need to change the colors dynamically so I wouldn't like to use stylesheets. I feel that I need to override the paint function but I am not sure.
I will consider stylesheets as a last resort.
@Omni_Philm said in Specifying Color for progress bar in QProgressBar:
I would need to change the colors dynamically so I wouldn't like to use stylesheets
Stylesheet can be dynamic too.
QColor barColor = QColor(255, 0, 0); QString style = QString("QProgressBar::chunk { background-color: %1; width: 20px; }").arg(barColor.name()); this->setStylesheet(style);
https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qprogressbar
-
If you override the paint function (paintEvent), then you'll need to paint the whole progress bar yourself. You don't want to do that...
You know, sometimes the default QStyle don't use QPalette to get the color.
In this situation, stylesheet is your best choice. Or you may consider changing to fusion style, which is not very "native" though. -
@Omni_Philm said in Specifying Color for progress bar in QProgressBar:
I would need to change the colors dynamically so I wouldn't like to use stylesheets
Stylesheet can be dynamic too.
QColor barColor = QColor(255, 0, 0); QString style = QString("QProgressBar::chunk { background-color: %1; width: 20px; }").arg(barColor.name()); this->setStylesheet(style);
https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qprogressbar
@Pl45m4 said in Specifying Color for progress bar in QProgressBar:
@Omni_Philm said in Specifying Color for progress bar in QProgressBar:
I would need to change the colors dynamically so I wouldn't like to use stylesheets
Stylesheet can be dynamic too.
QColor barColor = QColor(255, 0, 0); QString style = QString("QProgressBar::chunk { background-color: %1; width: 20px; }").arg(barColor.name()); this->setStylesheet(style);
https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qprogressbar
Thanks however, each time I get into using stylesheets, there are always additional issues that pop up and I have to reformat the look of everything.
I liked the the way the progress bar looked with the rounded corners. Now it is just a rectangle.
Edit:
Nevermind, I got it working!Edit 2:
Ok, I got it mostly working. I am trying to change the width of the chunk and it seems that width: 20px is breaking it -
I know I'm late the the game on this particular request, but I recently had the same need and found what I think is a better and easier solution. In particular, I liked the look of the base style and only wanted the color of the chunk, and for light colored chunks, have a dark text over it.
The general principle is to make a copy of the QPalette for the QProgressBar in question. Then change QPalette::Highlight role color and the QPalette::HighlightText role based on the parameter being displayed in the copy and then assign the QPalette to the QProgressBar. Do this in the valueChanged(int) slot. In my example, I was assessing a motor speed.
void MainWindow::on_TachometerBar_valueChanged(int value) { static QPalette p(ui->TachometerBar->palette()); //Static used here to only initialize once if (value < 600) { p.setColor(QPalette::Highlight, Qt::yellow); p.setColor(QPalette::HighlightedText, Qt::black); } else if (value < 1800) { p.setColor(QPalette::Highlight, Qt::darkGreen); p.setColor(QPalette::HighlightedText, Qt::white); } else if (value < 2000) { p.setColor(QPalette::Highlight, Qt::yellow); p.setColor(QPalette::HighlightedText, Qt::black); } else { p.setColor(QPalette::Highlight, Qt::red); p.setColor(QPalette::HighlightedText, Qt::white); } ui->TachometerBar->setPalette(p); }