windows 任务管理器--动态图的生成

 接下来面临的问题：

1) CPU 内存 使用情况的图示化动态显示

2） 该种动态图示化信息添加到 listwidget中的方法。

目录

1.chart模块的使用

目录

1.chart模块的使用

1.1 采用控件graphic view

1.2  提升Graphic view为类QChartView

1.3 工程文件和源码文件增加相关配置

1.4 代码实战

   原理分析

1） 首先构造最小的数据，比如Series（即上图右侧的Series数据）,实例

2）创建数据的容器QChart的实例，即上图右侧部分

3） 将数据和view进行关联

官网资料

---

 

1.chart模块的使用

1.1 采用控件graphic view

在designer的界面窗体中，拖入一个 graphic view，作为chart的显示控件。

 

1.2  提升Graphic view为类QChartView

右击 graphic view控件，选择 “提升为”，将QGraphicsView 提升为QChartView，这样后续可以使用QChartView中的类和方法对 graphic view控件进行操作了。

此处的名称 QChartView 是固定的，不要随便填写。

实际上qchartview.h这个文件在QT的安装目录，例如我的在此目录下（前提你在安装QT时选择了QChart 模块）：

1.3 工程文件和源码文件增加相关配置

 1）在工程的pro配置文件中，增加，以便工程可以引用相关的模块及头文件，否则会出现qchartview.h找不到的编译错误。

   QT += core gui

    QT += charts

2） 在窗体对应的头文件中（例如我的窗体为cfg.ui，对应的头文件为ui_cfg.h）增加

#include <QtCharts>
using namespace QtCharts;

由于刚才已经将graphic view提升为QChartView，因而在窗体的类定义中会使用类QChartView，不包含上面两行会报错。

graphicsView = new QChartView(page);  //提升后graphicsView的实例有类QChartView实现了

本质上，要保证工程中的源文件在引用QChartView的实例时要找到相关的接口声明，因而上述两行不一定放到ui_cfg.h中。例如

在我的工程中，我放到cfg.h的头文件中，

而在cfg.cpp中，其头文件的顺序是这样的，这就保证了ui_cfg.h中队QChartView引用时，可以找到相关类及接口

1.4 代码实战

   原理分析

   在进行代码之前，先了解相关类之间的关系。QT使用了经典的model-view模式，而在Qchart中亦是如此。两个主要类的关系为

其中QchartView负责显示，而Qchart则负责数据部分，具体的数据由坐标系、点坐标等构成。

了解基本的结构，那我们

1） 首先构造最小的数据，比如Series（即上图右侧的Series数据）,实例

  QLineSeries* line1 = new QLineSeries();// 创建线的实例

  line1->append(1,2);  //添加数据。3个点的坐标
  line1->append(2,4);
  line1->append(3,2);

2）创建数据的容器QChart的实例，即上图右侧部分

  

QChart* c = new QChart();  //创建数据model的实例
c->addSeries(line1);    // 添加具体的数据，此处添加一根线的数据

3） 将数据和view进行关联

  ui->graphicsView->setChart(c);

graphicsView在上面通过designer进行设计，并进行类的提升后已经创建。此处将model Qchart中的数据给它，View就可以显示出需要的数据了。

  效果图：

 

资料搜索

1)  官网资料 C:\Qt\Qt5.13.2\Examples\Qt-5.13.2\charts\dynamicspline  参考例子

2) https://blog.csdn.net/LKZYnih/article/details/81915436  介绍了初级应用

 

官网资料

https://doc.qt.io/qt-5/qtcharts-module.html  介绍了各个chart类和基本的配置

https://doc.qt.io/qt-5/qtcharts-overview.html  各种chart的使用示例

https://doc.qt.io/qt-5/qchart.html     QChart类的定义。

https://doc.qt.io/qt-5/qchartview.html  QChartView类的定义