【QT小作】使用QPainter绘制圆形进度条

实现效果

【QT小作】使用QPainter绘制圆形进度条_第1张图片

代码
// .h
#ifndef LQCIRCULARPROGRESS_H
#define LQCIRCULARPROGRESS_H

#include 

class LQCircularProgress : public QWidget
{
    Q_OBJECT
public:
    explicit LQCircularProgress(QWidget *parent = nullptr);

public:
    void setValue(int value);
    void setWidth(int width);
    void setColor(const QColor &color);
    void setFontPixSize(int size);

protected:
    void paintEvent(QPaintEvent *event) override;

private:
    int m_value;
    int m_width;
    QColor m_color;
    int m_fontSize;
};

#endif // LQCIRCULARPROGRESS_H

// .cpp
#include "lqcircularprogress.h"
#include 
#include 
#include 
#include 

LQCircularProgress::LQCircularProgress(QWidget *parent) : QWidget(parent)
{
    m_value = 0;
    m_width = 50;
    m_color = QColor(50, 250, 200);
    m_fontSize = 24;
}

void LQCircularProgress::setValue(int value)
{
    m_value = value;
    update();
}

void LQCircularProgress::setWidth(int width)
{
    m_width = width;
}

void LQCircularProgress::setColor(const QColor &color)
{
    m_color = color;
}

void LQCircularProgress::setFontPixSize(int size)
{
    m_fontSize = size;
}

void LQCircularProgress::paintEvent(QPaintEvent *event)
{
    Q_UNUSED(event);
    QPainter painter(this);

    // 设置反走样
    painter.setRenderHint(QPainter::Antialiasing, true);

    // 获取中心点
    float centerX = width() / 2;
    float centerY = height() / 2;

    // 外圆 灰色
    float outerRectW = qMin(width(), height());
    float outerRectX = centerX - outerRectW / 2;
    float outerRectY = centerY - outerRectW / 2;
    QRectF outerRect(outerRectX, outerRectY, outerRectW, outerRectW);

    QPen pen(Qt::NoPen);
    painter.setPen(pen);
    painter.setBrush(QColor(177, 177, 177));
    painter.drawEllipse(outerRect);

    // 环状进度条
    int startAngle = 90 * 16;
    int spanAngle = -m_value * 3.6 * 16;
    painter.setBrush(m_color);
    painter.drawPie(outerRect, startAngle, spanAngle);

    // 内圆 窗口背景颜色为底色
    float innerRectX = outerRectX + m_width;
    float innerRectY = outerRectY + m_width;
    float innerRectW = outerRectW - m_width * 2;
    QRectF innerRect(innerRectX, innerRectY, innerRectW, innerRectW);
    painter.setBrush(palette().window());
    painter.drawEllipse(innerRect);

    pen.setStyle(Qt::SolidLine);
    pen.setWidth(2);
    painter.setPen(pen);
    QFont font = painter.font();
    font.setPixelSize(m_fontSize);
    painter.setFont(font);
    painter.drawText(outerRect, Qt::AlignCenter, QString("%1%").arg(m_value));
}

你可能感兴趣的:(QT,·,随记,QT,QPainter,圆形进度条)