QT实现自定义带有提示信息的透明环形进度条

1. 概述

---

做界面开发的童鞋可能都会遇到这样的需求，就是有一些界面点击了之后比较耗时的操作，需要界面给出一个环形进度条的进度反馈信息. 如何来实现这样的需求呢，话不多说，上效果

透明进度条

2. 代码实现

---

waitfeedbackprogressbar.h

#ifndef WAITFEEDBACKPROGRESSBAR_H
#define WAITFEEDBACKPROGRESSBAR_H#include <QWidget>
#include <QTimer>
#include "customcomponent_global.h"class CUSTOMCOMPONENT_EXPORT WaitFeedbackProgressBar : public QWidget
{Q_OBJECT
public:WaitFeedbackProgressBar(QWidget *parent = nullptr);~WaitFeedbackProgressBar();void start();void stop();protected:void paintEvent(QPaintEvent *event);private slots:void updaterRotation();private:QTimer *m_timer = nullptr;int m_rotation = 0;
};#endif  // WAITFEEDBACKPROGRESSBAR_H

waitfeedbackprogressbar.cpp

#include "waitfeedbackprogressbar.h"#include <QPainter>
#include <QPainterPath>WaitFeedbackProgressBar::WaitFeedbackProgressBar(QWidget *parent): QWidget(parent)
{m_timer = new QTimer;connect(m_timer, &QTimer::timeout,this, &WaitFeedbackProgressBar::updaterRotation);
}WaitFeedbackProgressBar::~WaitFeedbackProgressBar()
{if (m_timer != nullptr) {disconnect(m_timer, &QTimer::timeout,this, &WaitFeedbackProgressBar::updaterRotation);delete m_timer;m_timer = nullptr;}
}void WaitFeedbackProgressBar::start()
{if (m_timer == nullptr) {return;}m_timer->start(3);
}void WaitFeedbackProgressBar::stop()
{if (m_timer == nullptr) {return;}m_timer->stop();
}void WaitFeedbackProgressBar::updaterRotation()
{m_rotation++;if(m_rotation == 360){m_rotation = 0;}update();
}void WaitFeedbackProgressBar::paintEvent(QPaintEvent *event)
{int width = this->width();int height = this->height();int side = qMin(width, height);QPainter painter(this);painter.setRenderHints(QPainter::Antialiasing | QPainter::TextAntialiasing);painter.translate(width / 2, height / 2);painter.scale(side / 200.0, side / 200.0);QConicalGradient gra(QPoint(0,0),0);gra.setColorAt(0, QColor("#3BB6FE"));gra.setColorAt(1, QColor("#FFFFFF"));QBrush brush(gra);int radis = 40;int sider = 5;QRect rect(-radis, -radis, radis * 2, radis * 2);QPainterPath path;path.arcTo(rect, 0, 270);QPainterPath subPath;subPath.addEllipse(rect.adjusted(sider, sider, -sider, -sider));path = path - subPath;painter.setBrush(brush);painter.setPen(Qt::NoPen);painter.rotate(m_rotation);painter.drawPath(path);
}

waitfeedbackdialog.h

#ifndef WAITFEEDBACKDIALOG_H
#define WAITFEEDBACKDIALOG_H#include <QDialog>
#include "dialog_global.h"namespace Ui {
class WaitFeedbackDialog;
}class DIALOG_EXPORT WaitFeedbackDialog : public QDialog
{Q_OBJECT
public:explicit WaitFeedbackDialog(QWidget *parent = nullptr);void start();void stop();signals:private:Ui::WaitFeedbackDialog *ui;
};#endif  // WAITFEEDBACKDIALOG_H

waitfeedbackdialog.cpp

#include "waitfeedbackdialog.h"
#include "ui_waitfeedbackdialog.h"WaitFeedbackDialog::WaitFeedbackDialog(QWidget *parent) :QDialog(parent),ui(new Ui::WaitFeedbackDialog)
{ui->setupUi(this);setWindowFlags(Qt::FramelessWindowHint | windowFlags());setAttribute(Qt::WA_TranslucentBackground, true);
}void WaitFeedbackDialog::start()
{ui->wgt_feedbackprogress->start();
}void WaitFeedbackDialog::stop()
{ui->wgt_feedbackprogress->stop();
}

waitfeedbackdialog.ui