Qt+C++自定义控件仪表盘动画仿真

这篇具有很好参考价值的文章主要介绍了Qt+C++自定义控件仪表盘动画仿真。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

程序示例精选

Qt+C++自定义控件仪表盘动画仿真

如需安装运行环境或远程调试,见文章底部个人QQ名片,由专业技术人员远程协助!

前言

这篇博客针对<<Qt+C++自定义控件仪表盘动画仿真>>编写代码,代码整洁,规则,易读。 学习与应用推荐首选。


文章目录

一、所需工具软件

二、使用步骤

        1. 引入库

        2. 代码实现

        3. 运行结果

三、在线协助

一、所需工具软件

1. VS, Qt

2. C++

二、使用步骤

1.引入库

#include <QWidget>
#include <QPropertyAnimation>
#include <QtMath>
#include <QPainter>

2. 代码实现

代码如下:

#include "GaugePanel.h"
GaugePanel::~GaugePanel()
{
    hShearAnimation->stop();
    vShearAnimation->stop();
    delete hShearAnimation;
    delete vShearAnimation;
}

void GaugePanel::paintEvent(QPaintEvent*)
{
    int width = this->width();
    int height = this->height();
    int side = qMin(width, height);

    //绘制准备工作,启用反锯齿,平移坐标轴中心,等比例缩放
    QPainter painter(this);
    painter.setRenderHints(QPainter::Antialiasing | QPainter::TextAntialiasing);
    painter.translate(width / 2, height / 2);
    painter.scale(side / 215.0, side / 215.0);

    painter.shear(double(hShearValue / 100.0f), double(vShearValue / 100.0f));

    //内层渐变
    drawInnerGradient(&painter);

    //外层渐变
    drawOuterGradient(&painter);

    //外层光晕
    drawOuterHalo(&painter);

    //刻度线
    drawScale(&painter);

    //刻度值
    drawScaleNum(&painter);

    //绘制指针
    drawPointer(&painter);

    //绘制指针扇形
    drawPointerSector(&painter);

    //绘制值
    drawValue(&painter);

    //绘制单位
    drawUnit(&painter);
}

void GaugePanel::drawOuterGradient(QPainter* painter)
{
    if (radiusHalo <= radiusOuter)
        return;

    painter->save();

    QRectF rectangle(0 - radiusHalo, 0 - radiusHalo, radiusHalo * 2, radiusHalo * 2);
    QPen framePen(colorOuterFrame);
    framePen.setWidthF(1.5f);
    painter->setPen(framePen);
    painter->drawEllipse(rectangle);

    painter->setPen(Qt::NoPen);

    QPainterPath smallCircle;
    QPainterPath bigCircle;

    float radius = radiusOuter;
    smallCircle.addEllipse(-radius, -radius, radius * 2, radius * 2);
    radius += (radiusHalo - radiusOuter);
    bigCircle.addEllipse(-radius, -radius, radius * 2, radius * 2);

    //大圆抛去小圆部分
    QPainterPath gradientPath = bigCircle - smallCircle;
    QRadialGradient gradient(0, 0, radius, 0, 0);
    //gradient.setSpread(QGradient::ReflectSpread);

    gradient.setColorAt(0.85, colorOuterStart);
    gradient.setColorAt(0.98, colorOuterEnd);
    painter->setBrush(gradient);
    painter->drawPath(gradientPath);

    painter->restore();
}

void GaugePanel::drawInnerGradient(QPainter* painter)
{
    if (radiusOuter <= radiusInner)
        return;

    painter->save();
    painter->setPen(Qt::NoPen);

    QPainterPath smallCircle;
    QPainterPath bigCircle;

    float radius = radiusInner;
    smallCircle.addEllipse(-radius, -radius, radius * 2, radius * 2);
    radius += (radiusOuter - radiusInner);
    bigCircle.addEllipse(-radius, -radius, radius * 2, radius * 2);

    //大圆抛去小圆部分
    QPainterPath gradientPath = bigCircle - smallCircle;
    QRadialGradient gradient(0, 0, radius, 0, 0);
    //gradient.setSpread(QGradient::ReflectSpread);

    gradient.setColorAt(0.7, colorInnerStart);
    gradient.setColorAt(1, colorInnerEnd);
    painter->setBrush(gradient);
    painter->drawPath(gradientPath);

    painter->restore();
}

void GaugePanel::drawOuterHalo(QPainter* painter)
{
    painter->save();
    painter->setPen(Qt::NoPen);

    QPainterPath smallCircle;
    QPainterPath bigCircle;

    float radius = radiusHalo;
    smallCircle.addEllipse(-radius, -radius, radius * 2, radius * 2);
    radius += (110.0 - radiusHalo);
    bigCircle.addEllipse(-radius, -radius, radius * 2, radius * 2);

    //大圆抛去小圆部分
    QPainterPath gradientPath = bigCircle - smallCircle;
    QRadialGradient gradient(0, 0, 100, 0, 0);
    gradient.setSpread(QGradient::ReflectSpread);

    gradient.setColorAt(radiusHalo / 100, colorHaloStart);
    gradient.setColorAt(1, colorHaloEnd);
    painter->setBrush(gradient);
    painter->drawPath(gradientPath);

    painter->restore();
}

void GaugePanel::drawScale(QPainter* painter)
{
    float radius = 85;
    painter->save();
    painter->setPen(QColor(255, 255, 255));

    painter->rotate(30);
    int steps = (30);
    double angleStep = (360.0 - 60) / steps;
    QPen pen = painter->pen();
    pen.setCapStyle(Qt::RoundCap);

    for (int i = 0; i <= steps; i++) {
        if (i % 3 == 0) {
            pen.setWidthF(1.5);
            painter->setPen(pen);
            QLineF line(0.0f, radius - 8.0f, 0.0f, radius);
            painter->drawLine(line);
        }
        else {
            pen.setWidthF(0.5);
            painter->setPen(pen);
            QLineF line(0.0f, radius - 3.0f, 0.0f, radius);
            painter->drawLine(line);
        }

        painter->rotate(angleStep);
    }

    painter->restore();
}

void GaugePanel::drawScaleNum(QPainter* painter)
{
    float radius = 95.0f;
    painter->save();
    painter->setPen(QColor(255, 255, 255));

    double startRad = (330 - 90) * (M_PI / 180);
    double deltaRad = (300) * (M_PI / 180) / 10;

    for (int i = 0; i <= 10; i++) {
        double sina = sin(startRad - i * deltaRad);
        double cosa = cos(startRad - i * deltaRad);
        double value = 1.0 * i * ((30) / 10);//刻度值范围

        QString strValue = QString("%1").arg((double)value, 0, 'f', 0);
        double textWidth = fontMetrics().width(strValue);
        double textHeight = fontMetrics().height();
        int x = radius * cosa - textWidth / 2;
        int y = -radius * sina + textHeight / 4;
        painter->drawText(x, y, strValue);
    }

    painter->restore();
}

void GaugePanel::drawPointer(QPainter* painter)
{
    painter->save();

    float radius = 83.0;
    painter->rotate(30 + int(value * 10));
    QPen pen = painter->pen();
    pen.setWidthF(1.0);
    pen.setColor(QColor(50, 154, 255, 200));
    painter->setPen(pen);
    QLineF line(0.0f, 0.0f, 0.0f, radius);
    painter->drawLine(line);

    painter->restore();
}

void GaugePanel::drawPointerSector(QPainter* painter)
{
    float radius = 87.5f;
    painter->save();
    painter->setPen(Qt::NoPen);

    QRectF rect(-radius, -radius, radius * 2, radius * 2);
    painter->setBrush(QColor(50, 154, 255, 50));
    painter->drawPie(rect, -120 * 16, -value * 16 * 10);

    painter->restore();
}

void GaugePanel::drawValue(QPainter* painter)
{
    int radius = 100;
    painter->save();
    painter->setPen(QColor(255, 255, 255));
    painter->setFont(QFont("Arial", 22, 22, true));

    QRectF textRect(-radius, -radius, radius * 2, radius * 2);
    QString strValue = QString("%1").arg((double)value, 0, 'f', 0);
    painter->drawText(textRect, Qt::AlignCenter, strValue);

    painter->restore();
}

void GaugePanel::drawUnit(QPainter* painter)
{
    int radius = 100;
    painter->save();
    painter->setPen(QColor(255, 255, 255));
    painter->setFont(QFont("Arial", 9, -1, true));

    QRectF textRect(-radius, -radius + 20, radius * 2, radius * 2);
    painter->drawText(textRect, Qt::AlignCenter, "km/h");

    painter->restore();
}

double GaugePanel::getValue() const
{
    return this->value;
}

int GaugePanel::getHShearValue() const
{
    return this->hShearValue;
}

int GaugePanel::getVShearValue() const
{
    return this->vShearValue;
}

double GaugePanel::getRadiusInner() const
{
    return radiusInner;
}

double GaugePanel::getRadiusOuter() const
{
    return radiusOuter;
}

double GaugePanel::getRadiusHalo() const
{
    return radiusHalo;
}

QColor GaugePanel::getColorOuterFrame() const
{
    return colorOuterFrame;
}

QColor GaugePanel::getColorInnerStart() const
{
    return colorInnerStart;
}

QColor GaugePanel::getColorInnerEnd() const
{
    return colorInnerEnd;
}

QColor GaugePanel::getColorOuterStart() const
{
    return colorOuterStart;
}

QColor GaugePanel::getColorOuterEnd() const
{
    return colorOuterEnd;
}

QColor GaugePanel::getColorHaloStart() const
{
    return colorHaloStart;
}

QColor GaugePanel::getColorHaloEnd() const
{
    return colorHaloEnd;
}

void GaugePanel::setValue(int value)
{
    setValue(double(value));
}

void GaugePanel::setValue(double value) {
    updateValue(value);
}

void GaugePanel::setHShearValue(int value)
{
    if (value > 100 || value < -100)
        return;

    this->hShearValue = value;
    update();
}

void GaugePanel::setVShearValue(int value)
{
    if (value > 100 || value < -100)
        return;

    this->vShearValue = value;
    update();
}

void GaugePanel::setColorOuterFrame(QColor color)
{
    colorOuterFrame = color;
}

void GaugePanel::setRadiusInner(int radius)
{
    setRadiusInner(double(radius));
}

void GaugePanel::setRadiusInner(double radius)
{
    if (radius >= 0.0f && radius < 100.0f) {
        radiusInner = radius;
        update();
    }
}

void GaugePanel::setRadiusOuter(int radius)
{
    setRadiusOuter(double(radius));
}

void GaugePanel::setRadiusOuter(double radius)
{
    if (radius > 0.0f && radius < 100.0f) {
        radiusOuter = radius;
        update();
    }
}

void GaugePanel::setRadiusHalo(int radius)
{
    setRadiusHalo(double(radius));
}

void GaugePanel::setRadiusHalo(double radius)
{
    if (radius > 0.0f && radius < 100.0f) {
        radiusHalo = radius;
        update();
    }
}

void GaugePanel::setColorInnerStart(QColor color)
{
    colorInnerStart = color;
}

void GaugePanel::setColorInnerEnd(QColor color)
{
    colorInnerEnd = color;
}

void GaugePanel::setColorOuterStart(QColor color)
{
    colorOuterStart = color;
}

void GaugePanel::setColorOuterEnd(QColor color)
{
    colorOuterEnd = color;
}

void GaugePanel::setColorHaloStart(QColor color)
{
    colorHaloStart = color;
}

void GaugePanel::setColorHaloEnd(QColor color)
{
    colorHaloEnd = color;
}

void GaugePanel::startShearAnimal(int duration, int hShearValue, int vShearValue)
{
    if (hShearValue == this->hShearValue && vShearValue == this->vShearValue) {
        return;
    }

    if (hShearAnimation->state() != QPropertyAnimation::Stopped) {
        hShearAnimation->stop();
    }

    if (vShearAnimation->state() != QPropertyAnimation::Stopped) {
        vShearAnimation->stop();
    }

    hShearAnimation->setDuration(duration);
    hShearAnimation->setStartValue(this->hShearValue);
    hShearAnimation->setEndValue(hShearValue);
    hShearAnimation->start();

    vShearAnimation->setDuration(duration);
    vShearAnimation->setStartValue(this->vShearValue);
    vShearAnimation->setEndValue(vShearValue);
    vShearAnimation->start();
}

void GaugePanel::updateValue(double value)
{
    if (value > 30.0 || value < 0.0) {
        return;
    }

    this->value = value;
    //update();
    this->update();
    // emit valueChanged(value);
}

3. 运行结果

Qt+C++自定义控件仪表盘动画仿真,C++,qt,c++,开发语言,visual studio,仿真

Qt+C++自定义控件仪表盘动画仿真,C++,qt,c++,开发语言,visual studio,仿真

三、在线协助:

如需安装运行环境或远程调试,见文章底部个人 QQ 名片,由专业技术人员远程协助!
1)远程安装运行环境,代码调试
2)Qt, C++, Python入门指导
3)界面美化
4)软件制作

当前文章连接:Python+Qt桌面端与网页端人工客服沟通工具_alicema1111的博客-CSDN博客

博主推荐文章:python人脸识别统计人数qt窗体-CSDN博客

博主推荐文章:Python Yolov5火焰烟雾识别源码分享-CSDN博客

                         Python OpenCV识别行人入口进出人数统计_python识别人数-CSDN博客

个人博客主页:alicema1111的博客_CSDN博客-Python,C++,网页领域博主

博主所有文章点这里alicema1111的博客_CSDN博客-Python,C++,网页领域博主文章来源地址https://www.toymoban.com/news/detail-650046.html

到了这里,关于Qt+C++自定义控件仪表盘动画仿真的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 界面控件DevExpress WPF Gauge组件 - 轻松实现个性化商业仪表盘

    DevExpress WPF Gauge(仪表)控件包含了多种圆形仪表类型、水平和垂直线性仪表、分段和矩阵数字仪表以及状态指示器,同时还具有最终用户交互性的集成支持。 P.S :DevExpress WPF拥有120+个控件和库,将帮助您交付满足甚至超出企业需求的高性能业务应用程序。通过DevExpress WPF能

    2024年02月06日
    浏览(40)
  • QPaint绘制自定义仪表盘组件01

    网上抄别人的,只是放这里自己看一下,看完就删掉 ui Dashboard.pro  mainwindow.h  mainwindow.cpp main.cpp 

    2024年02月22日
    浏览(28)
  • WordPress后台仪表盘自定义添加删除概览项目插件Glance That

    成功搭建WordPress站点,登录后台后可以在“仪表盘 – 概览”中看到包括多少篇文章、多少个页面、多少条评论和当前WordPress版本号及所使用的主题。具体如下图所示: 但是如果我们的WordPress站点还有自定义文章类型,也想在概览中显示出来应该怎么做呢?我还想要在概览中

    2024年01月18日
    浏览(31)
  • Qt —— 自定义飞机仪表控件(附源码)

    示例效果   部署环境      本人亲测版本Vs2017+Qt5.12.4,其他版本应该也可使用。   源码1

    2024年01月25日
    浏览(31)
  • echarts绘制仪表盘

     代码展示:

    2024年02月13日
    浏览(34)
  • Grafana增加仪表盘

    grafana 是一款采用Go语言编写的开源应用,主要用于大规模指标数据的可视化展现,是网络架构和应用分析中最流行的时序数据展示工具,目前已经支持绝大部分常用的时序数据库。 Grafana下载地址:https://grafana.com/grafana/download Grafana仪表盘模板下载地址:https://grafana.com/grafa

    2024年02月04日
    浏览(35)
  • 新版Grafana仪表盘

    一 Grafana 是什么         Grafana 是一个开源的指标量监测和可视化工具,常用于展示基础设施的时序数据和应用 程序运行分析。         官网指路: https://grafana.com/         与前文相关的两个概念:         1)数据源(Datasource):定义了将用方式来查询数据展

    2024年02月13日
    浏览(31)
  • QML 仪表盘小示例

    本次项目已发布在CSDN-GitCode,下载方便,安全,可在我主页进行下载即可,后面的项目和素材都会发布这个平台。 个人主页:https://gitcode.com/user/m0_45463480 怎么下载:在项目中点击克隆,windows:zip linux:tar.gz tar # .pro

    2024年02月05日
    浏览(35)
  • ChatGPT实现仪表盘生成

    Grafana是开源社区最流行的数据可视化软件,一定程度上也和 superset 一起被视为 tableau 等商业 BI 的开源替代品,很多IT 团队、科研团队,都会使用 Grafana 来做数据监控、挖掘分析。Grafana社区也有很多贡献者,在 github 上分享自己针对不同场景制作的数据分析仪表盘效果和配置

    2024年02月02日
    浏览(22)
  • 15. Canvas制作汽车油耗仪表盘

    1. 说明 本篇文章在14. 利用Canvas组件制作时钟的基础上进行一些更改,想查看全面的代码可以点击链接查看即可。 效果展示: 2. 整体代码

    2024年02月11日
    浏览(30)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包