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

相关推荐
RAN11426760082 小时前
1.3第一个程序的介绍
开发语言·qt
实心儿儿9 小时前
Qt — 命名方式、坐标系
qt
小小龙学IT11 小时前
Qt QPainter 2D 绘图系统深度解析:从画笔到渲染引擎适
c++·qt
深兰科技12 小时前
深兰科技受邀参与第二届中国(南宁)—东盟人工智能场景应用对接会,深化AI国际合作
人工智能·qt·r语言·scala·symfony·智能机器人·深兰科技
实心儿儿12 小时前
Qt — 对象树
qt
Quz1 天前
QML Repeater 数据模型:ListModel 与 C++ QAbstractListModel
qt
Quz1 天前
QML Repeater 基础用法:整数、JS 数组、字符串数组三种模型
qt
江湖人称菠萝包1 天前
【Qt】《Qt 5.9 C++开发指南》笔记-Chapter3-Qt类库概述
笔记·qt·qt5
qq_344920561 天前
Qt事件过滤器
开发语言·c++·qt
sunriver20001 天前
【Qt】由于找不到 Qt6Core5Compatd.dll
qt·qt6core5compatd