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

1. 什么时候会用到绘图?

1.1 简单绘制

比如,绘制温度的曲线时,如下:
image-20260812121041287

1.2 自定义控件

绘图很大的一个应用场景就是自定义控件
Qt提供的标准控件无法满足需求时,需要使用QPainter自定义绘制控件的外观,也就是自定义控件
如下,是自定义的一个仪表盘,接下来会详细说明其功能
image-20260812121228373

2. 本章效果演示

2.1 基本绘图

绘图用到的类是QPainter,关于基本绘图,整体效果如下:
image-20260812121252608

涉及的技术点,包括:

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

  • 画笔设置
    线宽、颜色、样式、连接、末端

  • 画刷设置
    颜色、样式

  • 高级选项
    变换、抗锯齿

2.2 温度曲线

当需要一些简单的绘制时,比如绘制温度曲线,可以直接使用QPainter
但是,如果需要更加复杂的曲线绘制,或柱状图等的绘制时,可以使用如下两个:

  • QChart
  • QCustomPlot

关于这两个的详细使用,我已录制完成了相应的视频教程
本节使用 Qt 中的QPainter,实现绘制高低温曲线,效果如下:

效果1 效果2

本节包含以下技术点:事件过滤器、画笔颜色和样式、虚线和实线、绘制文本、平滑曲线

2.3 自定义控件

自定义仪表盘-效果演示https://qt1024.cn/qt_ui/
我自定义实现的一个控件-仪表盘,效果如下:

效果1 效果2

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

效果1 效果2 效果3

该控件包括的技术点:

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

  • 刻度
    绘制、设置颜色、设置刻度的位置:圆环内侧、圆环外侧、圆环外侧(空隙)

  • 指针
    绘制、颜色、样式(圆形、尖形)、动画

  • 基础设置

    • 范围:设置最大值和最小值
    • 标题和单位:标题:比如,温度、湿度、电压、电流。单位:比如,°C%VA
    • 颜色:用于设置标题和单位的颜色
    • 背景:可以为整个控件添加一个背景色
    • 禁能:设置控件不可用时,各个部分的颜色。
      • 说明:为什么会有禁能这种状态?
      • 通常一个仪表盘对应一个设备,当在这个设备不在线时,就可以将控件设置为禁能,并设置各个部分的颜色为灰色