How to change Qt ProgressBar color? - qt

Question

I would like to change color of my progress bar from default green to red. I have this code, but the view is "flat", I would like to achieve something like "3d effect" as on picture below:
Code for red PB:
QPalette pal = ui->pbExtractionWidget->palette();
pal.setColor(QPalette::Normal, QColor(Qt::red));
QString danger = "QProgressBar::chunk {background: QLinearGradient( x1: 0, y1: 0, x2: 1, y2: 0,stop: 0 #FF0350,stop: 0.4999 #FF0020,stop: 0.5 #FF0019,stop: 1 #FF0000 );border-bottom-right-radius: 5px;border-bottom-left-radius: 5px;border: .px solid black;}";
ui->pbExtractionWidget->setStyleSheet(danger);
This is how it looks:

Answer 1

This link provides a way to style the progressbar.
This link provides a way to change gradient color for widgets.
Essentially, you just need to change the stylesheet correctly. Each Chunk is a piece of the progressbar.
Or use QPalette which uses Base to color the background of a widget. Set its gradient correctly and then do the following.
palette.setBrush( QPalette::Base, gradientVariable);
ui->pbExtractionWidget->setPalette(palette);

Answer 2

// In main.cpp
qDebug() << QStyleFactory::keys();
// If keys contains e.g. 'Fusion' it would be possible to change color of QProgressBar.
// On windows default style is 'Windows' and color can only be change with style sheets.
auto style = QStyleFactory::create("Fusion");
if (style) {
app.setStyle(style);
}
class MyProgressBar final : public QProgressBar {
void paintEvent(QPaintEvent*) final {
QStyleOptionProgressBar option{};
initStyleOption(&option);
option.textAlignment = Qt::AlignHCenter;
option.palette.setColor(QPalette::Highlight, QColor("lightskyblue"));
option.palette.setColor(QPalette::HighlightedText, option.palette.color(QPalette::Text));
QPainter painter{this};
style()->drawControl(QStyle::CE_ProgressBar, &option, &painter, this);
}
};

Answer 3

You have to set the stylesheet correctly, use below stylesheet code
QString danger = "QProgressBar::chunk: horizontal {border-radius: 3px; background: QLinearGradient(X1:0, y1:0.966136, x2:0, y2:0, stop:0.609721 rgba(242, 53, 53, 255), stop:0.691923 rgba(240, 151, 141, 252));border: .px solid black;}";
ui->progressBar->setStyleSheet(danger);