自定义圆形进度条

效果:

通过重绘的方式,实现一个自定义圆形进度条,风格有:圆弧风格、水池风格、圆弧水池风格和水波纹风格

具体实现:

#ifndef PROGRESSBARPERCENT_H
#define PROGRESSBARPERCENT_H

#include 

#ifdef quc
#if (QT_VERSION < QT_VERSION_CHECK(5,7,0))
#include 
#else
#include 
#endif

class QDESIGNER_WIDGET_EXPORT ProgressBarPercent : public QWidget
#else
class ProgressBar : public QWidget
#endif

{
    Q_OBJECT
    Q_ENUMS(PercentStyle)

    Q_PROPERTY(int minValue READ getMinValue WRITE setMinValue)
    Q_PROPERTY(int maxValue READ getMaxValue WRITE setMaxValue)
    Q_PROPERTY(int value READ getValue WRITE setValue)

    Q_PROPERTY(int nullPosition READ getNullPosition WRITE setNullPosition)
    Q_PROPERTY(int lineWidth READ getLineWidth WRITE setLineWidth)

    Q_PROPERTY(bool showPercent READ getShowPercent WRITE setShowPercent)
    Q_PROPERTY(bool showFree READ getShowFree WRITE setShowFree)
    Q_PROPERTY(bool showSmallCircle READ getShowSmallCircle WRITE setShowSmallCircle)
    Q_PROPERTY(bool clockWise READ getClockWise WRITE setClockWise)

    Q_PROPERTY(QColor usedColor READ getUsedColor WRITE setUsedColor)
    Q_PROPERTY(QColor freeColor READ getFreeColor WRITE setFreeColor)
    Q_PROPERTY(QColor circleColor READ getCircleColor WRITE setCircleColor)
    Q_PROPERTY(QColor textColor READ getTextColor WRITE setTextColor)

public:
    enum PercentStyle {
        PercentStyle_Arc = 0,           //圆弧风格
        PercentStyle_Polo = 1,          //水池风格
        PercentStyle_Arc_Polo = 2,      //圆弧水池风格
        PercentStyle_Wave = 3           //水波纹风格
    };

    explicit ProgressBar(QWidget *parent = 0);
    ~ProgressBar();

protected:
    void paintEvent(QPaintEvent *);
    void drawCircle(QPainter *painter, int radius);
    void drawArc(QPainter *painter, int radius);
    void drawPolo(QPainter *painter, int radius);
    void drawWave(QPainter *painter, int radius);
    void drawText(QPainter *painter, int radius);

private:
    int maxValue;                   //最小值
    int minValue;                   //最大值
    int value;                      //目标值

    int nullPosition;               //起始角度
    int lineWidth;                  //线条宽度

    bool showPercent;               //是否显示百分比
    bool showFree;                  //是否显示未使用进度
    bool showSmallCircle;           //是否显示小圆
    bool clockWise;                 //顺时针

    QColor usedColor;               //已使用百分比颜色
    QColor freeColor;               //未使用百分比颜色
    QColor circleColor;             //圆颜色
    QColor textColor;               //文字颜

你可能感兴趣的:(QtDemo,qt,进度条,重绘,水波,圆弧,qt5)