【详细】将qtchart图表放到ui上,以将官方折线图示例放到ui界面上为例


前言:刚刚开始接触Qt,看大佬的博客和官方文档学习时面临各种小坑,非常难受
因此发文记录,保证各种细节完整,对小白友好

使用环境为Qt5.14.0 MinGW 64

新建项目&打开官方示例项目

搜索chart,单击打开折线图示例程序
在这里插入图片描述
自动弹到help页面,回到qt creator界面在这里插入图片描述
如果打开失败,工程变成了一个感叹号,只有一个工程文件,可以参考我的另一篇博客

新建项目,如图选择在这里插入图片描述

Step1 链接charts模块(在安装Qt时要选择安装Qt Charts模块)

如图所示位置
在这里插入图片描述
添加charts
在这里插入图片描述

Step2 查看官方示例 做好准备工作(导入需要的库 命名空间宏定义的使用)

查看官方示例的main.cpp,发现需要的两个库,一个命名空间的宏定义
在这里插入图片描述
添加到我们工程的mainwindow.cpp中,注意要放到ui_mainwindow.h之前,否则ui_mainwindow.h文件内会报错
在这里插入图片描述

在这里插入图片描述

Step3 提供载体

打开mainwindow.ui文件,使用Graphics View控件
在这里插入图片描述
在这里插入图片描述
右键提升为
在这里插入图片描述
如图输入QChartView,下面qchartview.h会自动出来,单击添加
在这里插入图片描述
单击提升
在这里插入图片描述
可以看到刚刚添加的控件对象graphicsView的类已经变成了QChartView
在这里插入图片描述

回到程序界面先单击绿色播放按钮构建运行一次
这一波是为了接下来敲代码的时候,有刚刚添加的对象,否则一直奇异报错且没有敲代码提示
在这里插入图片描述
到官方示例main.cpp中复制代码
在这里插入图片描述
1->4都是相关代码,5我们的工程里有自己的所以不需要
放到我们mainwindow.cpp中,位置如图
在这里插入图片描述
在这里插入图片描述
小技巧,选择ctrl+i可以快速排版
在这里插入图片描述
修改4中的代码,将图标放到我们的graphicsView对象中
ps:要是刚刚没有先构建一次如图这个快速提示里就找不到graphicsView,而且敲进去会报错
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
同理修改表示设置抗锯齿的第二句代码
在这里插入图片描述
单击绿色播放按钮构建运行
在这里插入图片描述
成功!

到此已经结束了,如果还想知道这些代码的具体含义,看文档

猜你喜欢

转载自blog.csdn.net/qq_47110957/article/details/119513401