Qt Forum

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search
    • Unsolved

    Update: Forum Guidelines & Code of Conduct


    Qt World Summit: Early-Bird Tickets

    How to change the color of a progressBar, while keep other properties unchanged

    General and Desktop
    3
    7
    25248
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • S
      stuartx last edited by

      Hi, I want to change the color of a progressBar based on its value. Meanwhile I need to keep other properties of the widget unchanged. I applied the following lines to get the color changed. However the width and the border are also changed. Is there any way to keep the original properties and only change the color?
      @
      QString myStyleSheet = QString(" QProgressBar::chunk { background: yellow; }");
      QString s = ui->progressBar->styleSheet().append(myStyleSheet);
      ui->progressBar->setStyleSheet(s);
      @

      Thanks.

      1 Reply Last reply Reply Quote 0
      • L
        lgeyer last edited by

        There are two possibilites that come to my mind immediately :

        • Use a "gradient":http://developer.qt.nokia.com/forums/viewthread/12701 instead of a plain color
        • Save the style sheet before appending to it
          @
          ui->progressBar->setProperty("defaultStyleSheet", ui->progressBar->styleSheet());
          ...
          ui->progressBar->setStyleSheet(ui->progressBar->property("defaultStyleSheet").toString() +
          " QProgressBar::chunk { background: green; }");
          ...
          ui->progressBar->setStyleSheet(ui->progressBar->property("defaultStyleSheet").toString() +
          " QProgressBar::chunk { background: yellow; }");
          ...
          ui->progressBar->setStyleSheet(ui->progressBar->property("defaultStyleSheet").toString() +
          " QProgressBar::chunk { background: red; }");
          @
        1 Reply Last reply Reply Quote 0
        • S
          stuartx last edited by

          Hi Lukas,

          Thanks for the response. I tried the styleSheet solution. I does not work for me. The defaultStyleSheet turns out a empty string:
          @
          ui->progressBar->setStyleSheet(ui->progressBar->property("defaultStyleSheet").toString() +
          " QProgressBar::chunk { background: yellow; }");
          QString s = ui->progressBar->styleSheet();
          qDebug() << s;
          @

          The color changed. The width and border of the bar also changed.

          output:
          " QProgressBar::chunk { background: yellow; }"

          1 Reply Last reply Reply Quote 0
          • L
            lgeyer last edited by

            Unless you set a custom style sheet the default style sheet for a widget is always empty. If you want to modify an existing style (not style sheet) you will have to either alter the palette, subclass the corresponding QStyle or a QProxyStyle.

            1 Reply Last reply Reply Quote 0
            • S
              stuartx last edited by

              Could you provide some sample code for the QStyle or QProxyStyle?
              In addition, I only want to change the color of the bar, no need for fancy looking. Is there simple way to do that?

              Thanks.

              1 Reply Last reply Reply Quote 0
              • A
                andre last edited by

                Changing the palette may work on your platform & style, but it is not guaranteed to work everywhere. Styles are free to ignore it.

                1 Reply Last reply Reply Quote 0
                • S
                  stuartx last edited by

                  Hi Andre, I tried @QPalette p = (ui->progressBar->palette());
                  p.setColor(QPalette::Foreground, Qt::red);
                  p.setColor(QPalette::Background, Qt::green);
                  p.setColor(QPalette::Highlight, Qt::yellow);
                  ui->progressBar->setPalette(p);@ It did not work.

                  Now I use the original geometry of the bar to keep the original looking except the color. The result is close to what I wanted.

                  @
                  QRect r = ui->progressBar->geometry();

                  QString st = QString (
                              "QProgressBar::chunk {"
                              "background-color: #ff0000;"
                               "}");
                  
                  st.append("QProgressBar {"
                            "border: 1px solid grey;"
                            "border-radius: 2px;"
                            "text-align: center;"
                            "background: #eeeeee;"
                            "}");
                  ui->progressBar->setStyleSheet(st);
                  
                  ui->progressBar->setGeometry(r.x(), r.y()+3, r.width(), r.height()-6 );
                  

                  @
                  I develop this application on Mac and Linux. Do you have better method for this matter?

                  1 Reply Last reply Reply Quote 0
                  • First post
                    Last post