Custom progress bar



  • Hello,

    My experience in Qt is at this point very limited and I'm taking a dive in the deep by trying to create a custom progress bar for my application. The progress bar I'm trying to create needs to looks something like this: https://snag.gy/JYCHru.jpg

    Any hints on how to create such as custom progress bar are very appreciated.

    Thanks in advance!


  • Moderators

    @erwel
    Subclass QProgessBar and reimplement the paintEvent() handler like this:
    Untested, but it should give you an idea how to achieve it. Feel free to tweak it to your needs.

    void MyProgressBar::paintEvent( QPaintEvent* )
    {
           QPainter p( this );
           p.setPen( Qt::NoPen );
    
           qreal blockWidth = rect().width() / 10;
           qreal blockSpacing = blockWidth / 10;
           blockWidth -= blockSpacing;
    
           qreal blockHeight = rect().height();
    
           qreal percentageValue = (value() - minimum()) / (maximum() - minimum());
    
           for( int i = 0; i < 10; ++i )
           {
                   Qt::Color color = percentageValue >= (i+1)*10 ? Qt::green : Qt::white;
                   p.setBrush( color );
                   int x = i * (blockWidth + blockSpacing);
                   int y = 0;
                   p.drawRectF( QRect(x,y,blockWidth,blockHeight) );
           }
    }
    


  • @raven-worx Thank you, I learned about subclassing and it is pretty easy to modify the widgets to fit my needs. Now just finding out more about painting objects and I'm good to go.


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.