项目实战: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

相关推荐
San813_LDD5 小时前
[QT]《Qt 开发避坑指南:随机数、容器操作与 VS 环境配置》
开发语言·qt
稷下元歌11 小时前
七天学会plc加机器视觉之AI 接入 外设模块开发全详细操作文档(全程配套视频按文档实操)
python·sql·qt·贪心算法·r语言·wpf·时序数据库
艾莉丝努力练剑11 小时前
【QT】界面优化:QSS
linux·运维·开发语言·网络·qt·计算机网络·udp
雪的季节12 小时前
Qt 自定义表头
开发语言·qt
艾莉丝努力练剑13 小时前
【QT】系统相关:QT文件
linux·服务器·开发语言·网络·qt·tcp/ip·计算机网络
爱思考的小伙1 天前
Qt-03:串口助手
qt
864记忆1 天前
远程执行指令-常用指令集
qt
郝学胜_神的一滴1 天前
Qt 高级开发 026:QTabWidget御道,从筑基到化境
c++·qt
走好每一步1 天前
2、VDK 使用QVTKOpenGLNativeWidget嵌入到QT窗体中
qt·vtk·三维图像
nnnnichijou1 天前
Qt 6.9 嵌入式 Linux 交叉编译全栈填坑指南(以树莓派5 AArch64 为例
qt·嵌入式·交叉编译·qml·树莓派5