【QT开发笔记-基础篇】| 第五章 绘图QPainter | 5.1 效果演示、技术点

本节对应的视频讲解：B_站_视_频

https://www.bilibili.com/video/BV14P4y197pi

Qt 中绘图用到的类是 QPainter，可以实现点、线、矩形、圆形、多边形、圆弧、饼图、图片等的绘制

什么时候会用到绘图？

• 需要简单绘制时

比如，绘制温度的曲线时，如下：

• 自定义控件

绘图最大的一个应用场景就是自定义控件，Qt 本身提供的一些控件是有限的，并且它提供的一些控件很可能不满足我们的需要

这种情况下， 就需要自定义控件了。

如下，是自定义的一个仪表盘，接下来会详细说明其功能

本节主要介绍本章要实现的效果

1. 基本绘图

绘图用到的类是 QPainter，本节的效果截图如下：

其实这里参考的是官方提供的 demo，路径为：C:\Qt\Examples\Qt-5.15.2\widgets\painting\basicdrawing

本节包含以下技术点：

1.1 绘制图形

可以绘制的图形包括：

• 点
• 线
• 矩形、圆角矩形
• 椭圆、圆
• 多边形
• 圆弧、饼图、弦图
• 多段线、多边形
• 路径
• 文本
• 图片

1.2 画笔设置

画笔，对应 QPen 这个类，用于设置边框线的属性，包括：

• 线宽
• 颜色
• 样式
• 连接
• 末端

1.3 画刷

画刷，对应 QBrush 类，用于设置边框内部填充的属性，包括：

• 颜色
• 样式

1.4 高级选项

• 变换

• 抗锯齿

2. 温度曲线

在项目中需要一些简单的绘制时，比如绘制温度曲线，可以直接使用 QPainter

当然了，如果需要更加复杂的曲线绘制，或柱状图等的绘制时，可以使用如下两个：

• QChart
• QCustomPlot

后面会出一个专题：《Qt开发专题-绘制曲线》，专门讲解这两个类的使用

本节使用 Qt 中的 QPainter，实现绘制高低温曲线，效果如下：

本节包含以下技术点：

2.1 原生 QLabel 中绘制

• 事件过滤器

2.2 曲线属性

• 颜色
• 虚线、实线

2.3 绘制文本

• 文本颜色

3. 自定义控件

绘图最大的一个应用场景就是自定义控件，Qt 本身提供的一些控件是有限的，并且它提供的一些控件很可能不满足我们的需要

这种情况下， 就需要自定义控件了。

其实在实际项目中，会大量使用自定义控件， 这样会使界面美观的多！

下面介绍下自定义实现的一个控件 - 仪表盘

其实，大家可以在百度图库中，搜索 “仪表盘”，可以看到很多仪表盘的样式

不过这些样式，都大差不差，比如下面两个：

它可以直观地显示检测目标的值，比简单地使用文本框显示，要高大上的多

如下，是我自定义实现的一个控件-仪表盘，如下：

其中的圆环、刻度、指针都有许多属性可以设置，以下是几种典型的外观：

该控件包括的技术点：

3.1 创建自定义控件的类

首先，通常需要自定义一个类，继承自 QWidget；

然后，在布局中拖拽一个 QWidget 控件，并做提升

3.2 圆环

• 绘制
• 设置宽度
• 设置颜色
• 设置末端样式

3.3 刻度

• 绘制

• 设置颜色

• 设置刻度的位置

  圆环内侧

  圆环外侧

  圆环外侧(空隙)

3.4 指针

• 颜色

• 样式

  圆形

  尖形

• 动画

3.5 基础设置

• 范围

  设置最大值和最小值

• 标题和单位

  标题：比如，温度、湿度、电压、电流

  单位：比如，°C、%、V、A

• 颜色

  用于设置标题和单位的颜色

• 背景

  可以为整个控件添加一个背景色

• 禁能

  设置控件不可用时，各个部分的颜色

  说明：为什么会有禁能这种状态？

  通常一个仪表盘对应一个设备，当在这个设备不在线时，就可以将控件设置为禁能，并设置各个部分的颜色为灰色

后面会出一个专题：《Qt开发专题 - 自定义控件》，这个仪表盘就是该专题的第一个控件