前言

环形进度条，用来展示当前进度，为了满足大屏UI的需要特意定制，以前有个叫圆环进度条，不能满足项目需要，只能重新定做，以前的进度间距不能自适应分辨率，而且当前进度对应的反的进度不能单独设置颜色，即当前进度90%，剩余的10%也需要设置成不同的颜色，还有一个重要的功能是，能够指定多个警戒值，一旦超过或者小于该值，则当前进度自动切换到预先设定的警戒值颜色，而不需要用户自己去判断警戒值去设置警戒颜色，用户只需要传入当前值即可，这个功能非常实用，还可以设置警戒判断的标准是超过值还是小于值报警。个人感觉这个环形进度条功能完爆市面上所有的圆环进度条。只要稍作参数设置可以变成各种想要的效果，什么起始角度+动画效果+顺时针逆时针转等。

实现的功能

  • 1:可设置范围值,支持负数值
  • 2:可设置精确度,最大支持小数点后3位
  • 3:可设置起始角度
  • 4:可设置三种值+三种颜色,启用自动检测值后绘制不同的颜色
  • 5:可设置是否启用动画效果以及动画效果每次移动的步长
  • 6:可设置背景颜色/文字颜色/进度颜色/中间圆颜色
  • 7:可设置值警戒报警比较模式 0-不比较 1-最大值报警 2-最小值报警
  • 8:可设置显示的值是百分比
  • 9:可设置圆环与背景之间的距离即间距
  • 10:可设置圆环的宽度
  • 11:可设置圆环背景颜色,形成两种颜色差
  • 12:可设置顺时针逆时针转
  • 13:自适应窗体拉伸,刻度尺和文字自动缩放

效果图

 

环形进度条 android 环形进度条PPT_背景颜色

头文件代码

#ifndef PROGRESSRING_H
#define PROGRESSRING_H

/** * 环形进度条控件 作者:feiyangqingyun(QQ:517216493) 2019-5-1 * 1:可设置范围值,支持负数值 * 2:可设置精确度,最大支持小数点后3位 * 3:可设置起始角度 * 4:可设置三种值+三种颜色,启用自动检测值后绘制不同的颜色 * 5:可设置是否启用动画效果以及动画效果每次移动的步长 * 6:可设置背景颜色/文字颜色/进度颜色/中间圆颜色 * 7:可设置值警戒报警比较模式 0-不比较 1-最大值报警 2-最小值报警 * 8:可设置显示的值是百分比 * 9:可设置圆环与背景之间的距离即间距 * 10:可设置圆环的宽度 * 11:可设置圆环背景颜色,形成两种颜色差 * 12:可设置顺时针逆时针转 * 13:自适应窗体拉伸,刻度尺和文字自动缩放 */ #include <QWidget> #ifdef quc #if (QT_VERSION < QT_VERSION_CHECK(5,7,0)) #include <QtDesigner/QDesignerExportWidget> #else #include <QtUiPlugin/QDesignerExportWidget> #endif class QDESIGNER_WIDGET_EXPORT ProgressRing : public QWidget #else class ProgressRing : public QWidget #endif { Q_OBJECT Q_PROPERTY(double minValue READ getMinValue WRITE setMinValue) Q_PROPERTY(double maxValue READ getMaxValue WRITE setMaxValue) Q_PROPERTY(double value READ getValue WRITE setValue) Q_PROPERTY(int precision READ getPrecision WRITE setPrecision) Q_PROPERTY(bool showPercent READ getShowPercent WRITE setShowPercent) Q_PROPERTY(int alarmMode READ getAlarmMode WRITE setAlarmMode) Q_PROPERTY(int startAngle READ getStartAngle WRITE setStartAngle) Q_PROPERTY(int ringPadding READ getRingPadding WRITE setRingPadding) Q_PROPERTY(int ringWidth READ getRingWidth WRITE setRingWidth) Q_PROPERTY(bool animation READ getAnimation WRITE setAnimation) Q_PROPERTY(double animationStep READ getAnimationStep WRITE setAnimationStep) Q_PROPERTY(QColor bgColor READ getBgColor WRITE setBgColor) Q_PROPERTY(QColor textColor READ getTextColor WRITE setTextColor) Q_PROPERTY(QColor ringColor READ getRingColor WRITE setRingColor) Q_PROPERTY(QColor ringBgColor READ getRingBgColor WRITE setRingBgColor) Q_PROPERTY(QColor circleColor READ getCircleColor WRITE setCircleColor) Q_PROPERTY(int ringValue1 READ getRingValue1 WRITE setRingValue1) Q_PROPERTY(int ringValue2 READ getRingValue2 WRITE setRingValue2) Q_PROPERTY(int ringValue3 READ getRingValue3 WRITE setRingValue3) Q_PROPERTY(QColor ringColor1 READ getRingColor1 WRITE setRingColor1) Q_PROPERTY(QColor ringColor2 READ getRingColor2 WRITE setRingColor2) Q_PROPERTY(QColor ringColor3 READ getRingColor3 WRITE setRingColor3) public: explicit ProgressRing(QWidget *parent = 0); ~ProgressRing(); protected: void paintEvent(QPaintEvent *); void drawBg(QPainter *painter); void drawRing(QPainter *painter); void drawPadding(QPainter *painter); void drawCircle(QPainter *painter); void drawValue(QPainter *painter); private slots: void updateValue(); private: double minValue; //最小值 double maxValue; //最大值 double value; //目标值 int precision; //精确度,小数点后几位 bool clockWise; //顺时针逆时针 bool showPercent; //显示百分比 int alarmMode; //警戒报警模式,进度为不同的颜色 int startAngle; //起始角度 int ringPadding; //圆环间距 int ringWidth; //圆环宽度 bool animation; //是否启用动画显示 double animationStep; //动画显示时步长 QColor bgColor; //背景颜色 QColor textColor; //文字颜色 QColor ringColor; //圆环颜色 QColor ringBgColor; //圆环进度背景 QColor circleColor; //中心圆颜色 int ringValue1; //环形值1 int ringValue2; //环形值2 int ringValue3; //环形值3 QColor ringColor1; //环形颜色1 QColor ringColor2; //环形颜色2 QColor ringColor3; //环形颜色3 bool reverse; //是否往回走 double currentValue; //当前值 QTimer *timer; //定时器绘制动画 public: double getMinValue() const; double getMaxValue() const; double getValue() const; int getPrecision() const; bool getClockWise() const; bool getShowPercent() const; int getAlarmMode() const; int getStartAngle() const; int getRingPadding() const; int getRingWidth() const; bool getAnimation() const; double getAnimationStep() const; QColor getBgColor() const; QColor getTextColor() const; QColor getRingColor