Qt 圆形进度条实现
2024-04-01 00:06:09
1.运行截图
2.源码
.h#ifndef _QROUNDPROGRESSBAR_H_
#define _QROUNDPROGRESSBAR_H_#include <QWidget>class QRoundProgressBar : public QWidget
{Q_OBJECT//进度条形状enum BarStyle{//圆环状StyleDonut = 0,//圆饼状StylePie,//圆线状StyleLine};public:QRoundProgressBar(QWidget *parent , BarStyle style = StyleLine);~QRoundProgressBar();public://设置扫描弧度起始角度void setStartAngle(double position);//设置轮廓画笔的宽度void setOutlinePenWidth(double penWidth);//设置画笔宽度void setDataPenWidth(double penWidth);//设置进度条精度 88.88%,几位小数void setDecimals(int count);//设置进度条风格void setBarStyle(BarStyle style);//设置范围void setRange(double min, double max);//设置当前值void setValue(int val);//设置当前值void setValue(double val);//设置最小值void setMinimum(double min);//设置最大值void setMaximum(double max);protected:void paintEvent(QPaintEvent *event);//画基础图形void drawBase(QPainter& p, const QRectF& baseRect, const QRectF &innerRect);//根据值画出进度条void drawValue(QPainter& p, const QRectF& baseRect, double value, double arcLength, const QRectF & innerRect, double innerDiameter);//画中心文字void drawText(QPainter& p, const QRectF& innerRect, double value);private:double m_min; //最小值double m_max; //最大值double m_value; //当前值BarStyle m_barStyle; //进度条风格int m_decimals; //进度条精度double m_startAngel; //扫描弧度起始角度double m_outlinePenWidth; //轮廓画笔的宽度double m_dataPenWidth; //画笔宽度
};#endif // _QROUNDPROGRESSBAR_H_
.cpp
#include "QRoundProgressBar.h"
#include <QPainter>
#include <QPointF>
#include <QtMath>QRoundProgressBar::QRoundProgressBar(QWidget *parent , BarStyle style): QWidget(parent), m_min(0), m_max(100), m_value(0), m_startAngel(90), m_barStyle(style), m_outlinePenWidth(0), m_dataPenWidth(0), m_decimals(0)
{
}QRoundProgressBar::~QRoundProgressBar()
{
}void QRoundProgressBar::setStartAngle(double angle)
{if (angle != m_startAngel){m_startAngel = angle;update();}
}void QRoundProgressBar::setOutlinePenWidth(double penWidth)
{if (penWidth != m_outlinePenWidth){m_outlinePenWidth = penWidth;update();}
}void QRoundProgressBar::setDataPenWidth(double penWidth)
{if (penWidth != m_dataPenWidth){m_dataPenWidth = penWidth;update();}
}void QRoundProgressBar::setDecimals(int count)
{if (count >= 0 && count != m_decimals){m_decimals = count;update();}
}void QRoundProgressBar::setBarStyle(BarStyle style)
{if (style != m_barStyle){m_barStyle = style;update();}
}void QRoundProgressBar::setRange(double min, double max)
{m_min = min;m_max = max;if (m_max < m_min){qSwap(m_max, m_min);}if (m_value < m_min){m_value = m_min;}else if (m_value > m_max){m_value = m_max;}update();
}void QRoundProgressBar::setValue(double val)
{if (m_value != val){if (val < m_min){m_value = m_min;}else if (val > m_max){m_value = m_max;}else{m_value = val;}update();}
}void QRoundProgressBar::setValue(int val)
{setValue(double(val));
}void QRoundProgressBar::setMinimum(double min)
{setRange(min, m_max);
}void QRoundProgressBar::setMaximum(double max)
{setRange(m_min, max);
}void QRoundProgressBar::paintEvent(QPaintEvent* /*event*/)
{//外圈直径double outerDiameter = this->width();//外圈矩形QRectF baseRect(0, 0, outerDiameter, outerDiameter);QPainter p(this);p.setRenderHints(QPainter::Antialiasing | QPainter::SmoothPixmapTransform);//画背景矩形填充白色p.fillRect(baseRect, QBrush(QColor("#FFFFFF")));//内圆直径double innerDiameter;//内圈矩形QRectF innerRect;//计算内圈矩形if (m_barStyle == StyleLine){innerDiameter = outerDiameter - m_outlinePenWidth;}else if(m_barStyle == StyleDonut){innerDiameter = outerDiameter * 0.9;}double delta = (outerDiameter - innerDiameter) / 2;innerRect = QRectF(delta, delta, innerDiameter, innerDiameter);//画基础图形drawBase(p, baseRect, innerRect);//计算当前步长比例double arcStep = 360.0 / (m_max - m_min) * m_value;//根据值画出进度条drawValue(p, baseRect, m_value, arcStep, innerRect, innerDiameter);//画文字drawText(p, baseRect, m_value);p.end();
}void QRoundProgressBar::drawBase(QPainter &p, const QRectF &baseRect, const QRectF &innerRect)
{switch (m_barStyle){case StyleDonut:{QPainterPath dataPath;dataPath.setFillRule(Qt::OddEvenFill);dataPath.moveTo(baseRect.center());dataPath.addEllipse(innerRect);QPen pen;pen.setColor(QColor("#DEE3E7"));pen.setWidth(10);p.setPen(pen);p.setBrush(QBrush(QColor("#FFFFFF")));p.drawPath(dataPath);break;}case StylePie:{p.setPen(QPen(QColor("#FFFFFF"), m_outlinePenWidth));p.setBrush(QBrush(QColor("#DEE3E7")));p.drawEllipse(baseRect);break;}case StyleLine:{p.setPen(QPen(QColor("#FFFFFF"), m_outlinePenWidth));p.setBrush(Qt::NoBrush);p.drawEllipse(baseRect.adjusted(m_outlinePenWidth / 2, m_outlinePenWidth / 2, -m_outlinePenWidth / 2, -m_outlinePenWidth / 2));break;}default:{break;}}
}void QRoundProgressBar::drawValue(QPainter &p, const QRectF &baseRect , double value, double arcLength, const QRectF & innerRect, double innerDiameter)
{if (value == m_min){return;}if (m_barStyle == StyleLine){p.setPen(QColor("#2F8DED"));p.setBrush(Qt::NoBrush);p.drawArc(baseRect,m_startAngel * 16, -arcLength * 16);}else if (m_barStyle == StyleDonut){QPen pen;pen.setColor(QColor("#2F8DED"));pen.setWidth(10);pen.setCapStyle(Qt::RoundCap);p.setPen(pen);p.drawArc(innerRect, m_startAngel*16 , -16*arcLength);}else{//获取中心点坐标QPointF centerPoint = baseRect.center();QPainterPath dataPath;dataPath.setFillRule(Qt::WindingFill);dataPath.moveTo(centerPoint);//逆时针画弧长dataPath.arcTo(baseRect, m_startAngel, -arcLength);if (m_barStyle == StylePie){dataPath.lineTo(centerPoint);p.setPen(QPen(QColor("#2F8DED"), m_dataPenWidth));}p.setBrush(QBrush(QColor("#2F8DED")));p.drawPath(dataPath);}}void QRoundProgressBar::drawText(QPainter &p, const QRectF &rect, double value)
{QString textToDraw = "%";double percent = (value - m_min) / (m_max - m_min) * 100.0;textToDraw = QString::number(percent, 'f', m_decimals) + textToDraw;QFont f;f.setFamily("微软雅黑");f.setPixelSize(20);p.setFont(f);p.setPen(QColor("#606266"));p.drawText(rect, Qt::AlignCenter, textToDraw);
}
Qt 圆形进度条实现相关推荐
- QT自定义圆形进度条
以下是一个简单的示例,展示如何创建一个自定义的圆形进度条控件. 1.创建一个新的Qt控件类,继承QProgressBar类.在该类的头文件中添加以下代码: class CircularProg ...
- Qt浅谈之三十九圆形进度条
一.简介 Qt下进度条一般都是水平或垂直的,有时需要一个椭圆或圆来动态显示进度,或用此来显示存储百分比,都是比较适用的. 二.详解 1.代码 (1)widgetdisplay.h #ifndef WI ...
- 圆的css样式,圆形进度条css3样式
30% 以下样式100upx是50upx的2倍,这是尺寸比例 .con { position: relative; display: inline-block; height: 100upx; wid ...
- android 自定义音乐圆形进度条,Android自定义View实现音频播放圆形进度条
本篇文章介绍自定义View配合属性动画来实现如下的效果 实现思路如下: 根据播放按钮的图片大小计算出圆形进度条的大小 根据音频的时间长度计算出圆形进度条绘制的弧度 通过Handler刷新界面来更新圆形 ...
- Android自定义控件NumberCircleProgressBar(圆形进度条)的实现
Android自定义控件NumberCircleProgressBar(圆形进度条)的实现
- html进度条圆圈渐变色,HTML5 canvas带渐变色的圆形进度条动画
jquery-circle-progress是一款带渐变色的圆形进度条动画特效jQuery插件.该圆形进度条使用的是HTML5 canvas来绘制圆形进度条及其动画效果,进度条使用渐变色来填充,效果非 ...
- 微信小程序之圆形进度条（自定义组件）
前言 昨天在微信小程序实现了圆形进度条,今天想把这个圆形进度条做成一个组件,方便以后直接拿来用. 根据官方文档自定义组件一步一步来 创建自定义组件 第一步创建项目结构 打开微信开发者工具创建一个项目, ...
- Android 之 ProgressDialog用法介绍（矩形进度条 和 圆形 进度条）
2019独角兽企业重金招聘Python工程师标准>>> 布局文件: <LinearLayout xmlns:android="http://schemas.andro ...
- 【Android 应用开发】 自定义 圆形进度条 组件
转载著名出处 : http://blog.csdn.net/shulianghan/article/details/40351487 代码下载 : -- CSDN 下载地址 : http://down ...
最新文章
- LLVM基础技术图例
- 数论重大突破：120年后，希尔伯特的第12个数学难题借助计算机获得解决
- 安防行业成巨头必争之地 一文梳理安防AI芯片产品与主要企业
- php分享二十八：mysql运行中的问题排查
- 题目1012：畅通工程
- 梯度下降法与牛顿法的比较
- 共享几套silverlight2 toolkit最新的皮肤控件样式下载
- ddr3服务器内存条维修,详解服务器中内存故障的优质解决方案
- 每天一个linux命令（40）：wc命令
- Spring+hibernate+JSP实现Piano的数据库操作---4.配置文件
- 河南大学计算机组成原理,河南大学计算机组成原理考点.pdf
- AGV机器人核心部件——驱动轮
- 谷歌浏览器网页截屏插件工具下载与安装——FireShot
- Mysql 纵表转换为横表
- 【LeetCode-13】-罗马数字
- 腾飞之势，搏击苍穹：网页设计
- 不符合直接升级win11？教你怎么直接安装win11系统
- 逆转线性链表的算法c语言,pta-数据结构与算法题目集（中文）-4-1-单链表逆转...
- GIS功能区类型识别
- 基于网络小型文件型的数据管理系统