在线教育网站设计百度网盘帐号登录入口
前言：进入学习Python开发上位机界面的第二阶段，学习如何开发自定义控件，从常用的控件入手学习，本期主要学习如何使用PyQt5绘制水波浪形的柱状显示流量。但是最后我放弃了，因为水波的效果达不到我想要的。
1. 明确想要实现的控件效果
我想实现的效果是制作一个水波浪形的柱状控件用于显示流量。
要想实现的效果如下：
先来拆解需求：
明确水波浪形的柱状图需要具备的属性：
（1）用户设置流量数值，柱状图的水波能够到达相应的水平线；
（2）显示流量的水波柱的背景颜色应该允许用户设置；
（3）显示流量的水波柱的波浪浮动应该是两个波浪浮动曲线组成的，并且可以通过颜色的深浅看出是两个水波浪浮动，下层水波浪颜色深些；
2. 搬运代码
一个漂亮的水波浪动画效果：
附上可以直接运行的Python代码：
import sys
import math
from PyQt5.QtWidgets import QApplication, QWidget
from PyQt5.QtGui import QPainter, QColor, QPen
from PyQt5.QtCore import Qt, QRect, QTimerclass WaterWaveWidget(QWidget):def __init__(self):super().__init__()self.setGeometry(100, 100, 800, 400)self.setWindowTitle("Water Wave Flow Meter")self.wave1_amplitude = 50 # Amplitude for the first waveself.wave2_amplitude = 30 # Amplitude for the second waveself.wave_length = 200 # Length of one wave cycleself.phase_shift = 0 # Phase shift between the two wavesself.offset_x = 0 # Horizontal offset for animationself.timer = QTimer(self)self.timer.timeout.connect(self.update_wave)self.timer.start(100) # Update every 100 millisecondsdef update_wave(self):self.offset_x += 5 # Move the wave horizontallyif self.offset_x > self.wave_length:self.offset_x = 0self.update()def paintEvent(self, event):painter = QPainter(self)rect = self.rect()# Draw backgroundpainter.fillRect(rect, QColor(200, 200, 200))# Draw the two wavespen1 = QPen(QColor(0, 100, 200), 2) # Deep blue for the lower wavepen2 = QPen(QColor(173, 216, 230), 2) # Light blue for the upper wavepainter.setPen(pen1)for x in range(rect.left(), rect.right(), 10):y1 = rect.bottom() - int(self.wave1_amplitude* math.sin((x - self.offset_x) / self.wave_length * 2 * math.pi))y2 = rect.left() + xpainter.drawLine(y2, rect.bottom(), y2, y1)painter.setPen(pen2)for x in range(rect.left(), rect.right(), 10):y1 = rect.bottom() - int(self.wave2_amplitude* math.sin(((x - self.offset_x) / self.wave_length + self.phase_shift)* 2* math.pi))y2 = rect.left() + xpainter.drawLine(y2,y1 if y1 > rect.top() else rect.top(),y2,rect.bottom() if y1 < rect.bottom() else y1,)painter.end()if __name__ == "__main__":app = QApplication(sys.argv)widget = WaterWaveWidget()widget.show()sys.exit(app.exec_())3. 学到的知识点
3.1 QTimer定时器
参考文章：Qt 定时器 (QTimer)的几种使用方法
使用QTimer定时器类（这种方法普遍使用）
- 首先创建一个定时器类的对象
- QTimer *timer = new QTimer(this);
- timer 超时后会发出timeout()信号，所以在创建好定时器对象后给其建立信号与槽
- connect(timer, SIGNAL(timeout()), this, SLOT(onTimeout()));
- 在需要开启定时器的地方调用
-
void QTimer::start ( int msec );
-
这个start函数参数也是毫秒级别；
-
timer->start(msec );
self.timer = QTimer(self)self.timer.timeout.connect(self.update_wave)self.timer.start(50) # 每50毫秒更新一次
3.2 QPainterPath绘制路径
参考文章：QPainter和QPainterPath理解
QPainterPath 类（绘图路径）提供了一个容器，用于绘图操作，可以创建和重用图形形状。
绘图路径是由许多图形化的构建块组成的对象，例如：矩形、椭圆、直线和曲线。构建块可以加入在封闭的子路径中，例如：矩形或椭圆。封闭的路径的起点和终点是一致的，或者他们可以作为未封闭的子路径独立存在，如：直线和曲线。
QPainterPath 可以被填充、描绘轮廓、裁剪。要为一个指定的绘图路径生成可填充的轮廓，可以使用 QPainterPathStroker 类。与正常绘图相比，QPainterPath 的主要优点在于：复杂的图形只需创建一次，然后只需调用 QPainter::drawPath() 函数即可绘制多次。
QPainterPath 提供了一组函数，可用于获取绘图路径及其元素的信息。除了可以使用 toReversed() 函数来改变元素的顺序外，还有几个函数将 QPainterPath 对象转换成一个多边形表示。
moveTo()
void moveTo(const QPointF &point)
void moveTo(qreal x, qreal y)
把起始点移动到（x,y）
lineTo()
绘制直线
void QPainterPath::lineTo(qreal x, qreal y)
从当前点画一条直线到（x,y）点
closeSubpath()
void closeSubpath()
通过在子路径的开始处画一条线来关闭当前子路径，并自动启动一个新路径。新路径的当前点为(0,0)。如果子路径不包含任何元素，则此函数不执行任何操作。