Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

add shadow to a custom progress bar



  • Hi I have this class that im using to create a custom circular progress bar
    header

    #pragma once
    
    #include "stdafx.h"
    
    class CircularProgress : public QProgressBar
    {
    	Q_OBJECT
    
    public:
    	explicit CircularProgress(QWidget *parent = 0);
        void add_shadow();
        void set_value(int value);
        int value;
        int width;
        int height;
        int progress_width;
        int font_size;
        QColor progress_color;
        QColor text_color;
        QColor bg_color;
    
    protected:
        void paintEvent(QPaintEvent*);
    
    private:
        bool progress_rounded_cap;
        int max_value;
        // Text
        bool enable_text;
        QString font_family;
        QString suffix;
        // BG
        bool enable_bg;
        
    };
    

    cpp file

    #include "circular_progress.h"
    
    CircularProgress::CircularProgress(QWidget *parent)
    	: QProgressBar(parent),
    	value(0),
    	width(200),
    	height(200),
    	progress_width(10),
    	progress_rounded_cap(true),
    	max_value(100),
    	progress_color(0xff79c6),
    	enable_text(true),
    	font_family("Segoe UI"),
    	font_size(12),
    	suffix("%"),
    	text_color(0xff79c6),
    	enable_bg(true),
    	bg_color(0x44475a)
    {
    
    }
    
    void CircularProgress::add_shadow()
    {
    	QGraphicsDropShadowEffect* shadow = new QGraphicsDropShadowEffect(this);
    	shadow->setBlurRadius(15);
    	shadow->setXOffset(0);
    	shadow->setYOffset(0);
    	shadow->setColor(QColor(0, 0, 0, 80));
    	this->setGraphicsEffect(shadow);
    }
    
    void CircularProgress::set_value(int value)
    {
    	this->value = value;
    	this->repaint(); // Render progress bar after change value
    }
    
    void CircularProgress::paintEvent(QPaintEvent*)
    {
    	// SET PROGRESS PARAMETERS
    	int width = this->width - this->progress_width;
    	int height = this->height - this->progress_width;
    	int margin = this->progress_width / 2;
    	int value = this->value * 360 / this->max_value;
    
    	// PAINTER
    	QPainter paint = QPainter();
    	paint.begin(this);
    	paint.setRenderHint(QPainter::Antialiasing); // remove pixelated edges
    	paint.setFont(QFont(this->font_family, this->font_size));
    
    	// CREATE RECTANGLE
    	QRect rect = QRect(0, 0, this->width, this->height);
    	paint.setPen(Qt::NoPen);
    	paint.drawRect(rect);
    
    	// PEN
    	QPen pen = QPen();
    	pen.setWidth(this->progress_width);
    	// Set Round Cap
    	if (this->progress_rounded_cap)
    		pen.setCapStyle(Qt::RoundCap);
    
    	// ENABLE BG
    	if (this->enable_bg)
    		pen.setColor(QColor(this->bg_color));
    	paint.setPen(pen);
    	paint.drawArc(margin, margin, width, height, 0, 360 * 16);
    
    	// CREATE ARC / CIRCULAR PROGRESS
    	pen.setColor(QColor(this->progress_color));
    	paint.setPen(pen);
    	paint.drawArc(margin, margin, width, height, -90 * 16, -value * 16);
    
    	// CREATE TEXT
    	if (this->enable_text)
    		pen.setColor(QColor(this->text_color));
    	paint.setPen(pen);
    	paint.drawText(rect, Qt::AlignCenter, QString("%1%2").arg(this->value).arg(this->suffix));
    
    	// END
    	paint.end();
    }
    

    everything working as I excepted, but just one thing missing, I want to add a drop shadow to progress bar (not the whole progress bar, just to the bar itself, but sadly I dont have any Idea, anyone can help? thanks.


Log in to reply