项目实战:Qt圆形百分比进度控件基础设计构架Demo

若该文为原创文章,转载请注明出处

本文章博客地址:https://hpzwl.blog.csdn.net/article/details/161200392

长沙红胖子Qt(长沙创微智科)博文大全:开发技术集合(包含Qt实用技术、树莓派、三维、OpenCV、OpenGL、ffmpeg、OSG、单片机、软硬结合等等)持续更新中...

Qt开发专栏:项目实战(点击传送门)

需求

  通用圆形百分比进度控件。

  1.三圈背景圈

  2.进度条

  3.百分比显示

  4.颜色可调,圈粗细可变化,颜色可变化

  尽可能预留常用的属性与接口,方便后续整理与现场调试修改,减少临时修改代码和提高需求变更维护效率。

Demo_v1.0.0: circleProgressDemo v1.0.0

  

  

  

  

下载

  windows 运行包下载地址 CSDNf粉丝0积分下载:https://download.csdn.net/download/qq21497936/92883041

  QQ技术群,进Q群,点击"文件"搜索"circleProgressDemo",群内与博文同步更新)

关键源码

cpp 复制代码
void CirclePercentWidget::paintEvent(QPaintEvent *event)
{
    QPainter painter(this);
    painter.setRenderHint(QPainter::Antialiasing);
    drawBackground(&painter);
    drawCircle(&painter);
    drawProgress(&painter);
    drawText(&painter);
}

void CirclePercentWidget::drawBackground(QPainter *painter)
{
    painter->save();

    painter->fillRect(rect(), _backgroundColor);

    painter->restore();
}

void CirclePercentWidget::drawCircle(QPainter *painter)
{
    painter->save();

    painter->setBackground(Qt::transparent);

    painter->setPen(QPen(_circleColor1, _circleWidth1));
    int radius = _radius;

    radius = _radius - _circleSpace1 - _circleWidth1 / 2;
    painter->drawEllipse(_centerPointF, radius, radius);

    painter->setPen(QPen(_circleColor2, _circleWidth2));
    radius = _radius - _circleSpace1 - _circleWidth1 - _circleSpace2 - _circleWidth2 / 2;
    painter->drawEllipse(_centerPointF, radius, radius);

    painter->setPen(QPen(_circleColor3, _circleWidth3));
    radius = _radius - _circleSpace1 - _circleWidth1 - _circleSpace2 - _circleWidth2 - _circleSpace3 - _circleWidth3 / 2;
    painter->drawEllipse(_centerPointF, radius, radius);

    painter->restore();
}

void CirclePercentWidget::drawProgress(QPainter *painter)
{
    painter->save();

    painter->setPen(QPen(_progressColor, _circleProgressWidth, Qt::SolidLine, Qt::RoundCap));
    int radius = _radius - _circleProgressSpace - _circleProgressWidth / 2;
//    painter->drawEllipse(_centerPointF, radius, radius);
    painter->drawArc(_centerPointF.x() - radius, _centerPointF.y() - radius, radius * 2, radius * 2, 90 * 16, -_value * 16 * 3.6);

    painter->restore();
}

void CirclePercentWidget::drawText(QPainter *painter)
{
    painter->save();

    painter->setFont(_textFont);
    painter->setPen(QPen(_textColor));
    painter->drawText(                 0, _textYOffset, rect().width() / 2 + _textXOffset, rect().height() / 2 + _textYOffset, Qt::AlignRight | Qt::AlignBottom, QString("%1").arg(_value));

    painter->setFont(_labelFont);
    painter->setPen(QPen(_textColor));
    painter->drawText(rect().width() / 2 + 4 + _textXOffset, _textYOffset, rect().width() / 2 + _textXOffset, rect().height() / 2 + _textYOffset, Qt::AlignLeft | Qt::AlignBottom, "%");

    painter->setFont(_tipFont);
    painter->setPen(QPen(_labelColor));
    painter->drawText(0, 10 + _textYOffset, rect().width(), rect().height() + 10 + _textYOffset, Qt::AlignHCenter | Qt::AlignVCenter, _text);

    painter->restore();
}

工程模板v1.0.0

  

本文章博客地址:https://hpzwl.blog.csdn.net/article/details/161200392

相关推荐
sycmancia15 小时前
Qt——另一种创建线程的方式
开发语言·qt
sycmancia17 小时前
Qt——多线程与界面组件的通信
开发语言·qt·算法
Quz17 小时前
QML 基础组件专栏目录(V1)
qt·qml
程序员老陆18 小时前
使用Qt+大华设备SDK预览大华摄像机视频
qt·算法·音视频·视频监控
郝学胜-神的一滴19 小时前
Qt 高级编程 035:无边框窗口阴影以及圆角双特效实现
开发语言·c++·qt·程序人生·用户界面
甄同学2 天前
第二十篇:MCP协议集成,Claude Code如何扩展AI Agent的能力边界
开发语言·人工智能·qt
Liknana2 天前
Qt 圆角表格控件实战:setMask + 抗锯齿描边 + 多层阴影
qt·ui
Scott9999HH2 天前
2026 避坑实录:国产品牌压力变送器什么牌子好?从硬件抗扰到 C++ Qt 实时曲线绘制源码剖析
开发语言·c++·qt
皓悦编程记3 天前
【YOLO26 系列】基于YOLO26的垃圾分类检测系统【python源码+Pyqt5界面/WEB+数据集+训练代码】
python·qt·分类
十五年专注C++开发3 天前
qobject_cast转换失败原因分析
c++·qt·dynamic_cast·qobject_cast