Qt 常见的 QProgressBar 样式

在很多场景中都会用到进度条，比如：文件拷贝过程，软件更新等。QProgressBar 的样式可以通过自绘或者qss方式实现，本文对常用的进度条样式进行了整理：

实际效果图

实现代码

void MainDialog::InitUI()
{
    //
    ui->progressbar_1->setStyleSheet("QProgressBar{text-align: center;"
                                     "background-color: #e2e3e4;"
                                     "border: 1px solid #999999;"
                                     "border-radius: 5px;}"
                                     "QProgressBar::chunk{background-color: #995fff;"
                                     "border-radius: 5px;}");

    //
    ui->progressbar_2->setStyleSheet("QProgressBar{text-align: center;"
                                     "background-color: #e2e3e4;"
                                     "border: 0px solid #e2e3e4;"
                                     "border-radius: 5px;}"
                                     "QProgressBar::chunk{background-color: #995fff; "
                                     "border-radius: 5px;}");

    //
    ui->progressbar_3->setStyleSheet("QProgressBar{text-align: center;"
                                     "background-color: #e2e3e4;"
                                     "border: 0px solid #e2e3e4;"
                                     "border-radius: 3px;}"
                                     "QProgressBar::chunk{background-color:#995fff;"
                                     "border-radius: 3px; "
                                     "width: 10px;"
                                     "margin: 0.5px;}");

    //
    ui->progressbar_4->setStyleSheet("QProgressBar{height:24px; "
                                     "text-align: center; "
                                     "font-size: 14px; "
                                     "color: white; "
                                     "border-radius: 5px; "
                                     "background: #e2e3e4;}"
                                     "QProgressBar::chunk{border-radius: 5px;"
                                     "background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:0,"
                                     "stop:0 #995fff,"
                                     "stop:1 #6900ff);}");

    //
    ui->progressbar_5->setStyleSheet("QProgressBar{height:24px; "
                                     "text-align: center; "
                                     "font-size: 14px; "
                                     "color: white; "
                                     "border-radius: 0px; "
                                     "background: #e2e3e4;}"
                                     "QProgressBar::chunk{border-radius: 0px;"
                                     "background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:0,"
                                     "stop:0 #995fff,"
                                     "stop:1 #6900ff);}");

}

void MainDialog::InitData()
{
    //设置进度值
    ui->progressbar_1->setValue(40);
    ui->progressbar_2->setValue(50);
    ui->progressbar_3->setValue(60);
    ui->progressbar_4->setValue(70);
    //如果最小值和最大值都设置为0，进度条会显示一个繁忙指示，而不会显示当前的值。
    ui->progressbar_5->setMaximum(0);
    ui->progressbar_5->setMinimum(0);
    //隐藏百分百文字
    ui->progressbar_4->setTextVisible(false);
}