Qt练手小项目之绘制动态柱状图

最新推荐文章于 2025-07-08 23:55:09 发布

原创

最新推荐文章于 2025-07-08 23:55:09 发布 · 5.6k 阅读

30 ·

CC 4.0 BY-SA版权

本文介绍如何使用Qt 4.8.6在VS2008环境下创建一个可实时更新数据的柱状图，包括调整刻度范围、颜色及背景，支持动画效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

首先附上效果图。Qt版本4.8.6，IDE:vs2008.柱状图可根据数据变化实时增减，支持修改刻度值范围，修改柱状图颜色和背景颜色。实现起来并不复杂，使用的都是一些非常常见的Qt类和函数，下面就来看看主要代码。

首先，背景的绘制并没有使用QSS，这样可以实时更改背景色。背景使用渐变，很简单。

其次是刻度线和刻度值的绘制稍微麻烦一点，因为刻度线要分别绘制单位刻度线，中位刻度线和主刻度线。需要注意的是绘制的位置和刻度线需要梯度上升。

最后，绘制柱状图和柱状图背景都相对简单，只需要设置好柱状图所在的区域就能快速绘制。

主要部分源码如下：

#include "MeasuringBar.h"

#include <typeinfo>
#include <cmath>

#include <QLinearGradient>
#include <QString>
#include <QDebug>

#define DEVIATION 0.0001 //浮点数比较精度
#define LINEHPERSITION 15 //刻度线水平位置参数
#define TEXTWIDTH 5 //刻度值高度参数
#define TEXTHEIGHT 4 //刻度值宽度参数
#define BARHPOSITION 35 //柱状图水平位置参数

MeasuringBar::MeasuringBar(QWidget *parent)
   : QWidget(parent)
{
   Init();
   CreateConnection();
}

MeasuringBar::~MeasuringBar()
{
   if(m_timer->isActive())
   {
       m_timer->stop();
   }
}

void MeasuringBar::Init()
{
   m_dMinValue = 0.0; //最小值
   m_dMaxValue = 100.0; //最大值
   m_dTargetValue = 0.0; //目标值
   m_iPercision = 0; //精度值。小数点后几位

   m_iLongStep = 10; //长刻度条步长
   m_iShortStep = 1; //短刻度条步长
   m_iSpace = 20; //间距

m_bAnimation = false; //是否启用动画
m_dAnimationStep = 0.5; //动画播放时步长

   m_BGColorStart = QColor(100, 100, 100); //背景开始渐变色
   m_BGColorEnd = QColor(60, 60, 60); //背景结束渐变色
   m_LineColor = QColor(255, 255, 255); //线条颜色
   m_BarBGColor = QColor(220, 220, 220); //柱状图背景色
   m_BarColor = QColor(100, 184, 255); //柱状图颜色

m_bReverse = false; //是否倒退
m_dCurrentValue = 0.0; //当前值

m_timer = new QTimer(this);
m_timer->setInterval(10);

setFont(QFont("Arial", 8));
}

void MeasuringBar::CreateConnection()
{
connect(m_timer, SIGNAL(timeout()), this, SLOT(SltUpdateValue()));
}

void MeasuringBar::SltUpdateValue()
{
   if(!m_bReverse) //柱状图向上增长
   {
       if(m_dCurrentValue > m_dTargetValue)
       {
           m_dCurrentValue = m_dTargetValue;
           m_timer->stop();
     &nb