python -- PyQt5（designer）中文详细教程(九)绘图

PyQt5绘图系统能渲染矢量图像、位图图像和轮廓字体文本。⼀般会使用在修改或者提高现有组件的功能，或者创建自己的组件。使用PyQt5的绘图API进行操作。

M_Q_T

4679人浏览 · 2022-12-08 08:51:39

M_Q_T · 2022-12-08 08:51:39 发布

绘图

绘图由 paintEvent() 方法完成，绘图的代码要放在 QPainter 对象的 begin() 和 end()方法之间。是低级接口。

文本涂鸦

我们从画⼀些Unicode文本开始。

import sys
from PyQt5.QtWidgets import QWidget, QApplication
from PyQt5.QtGui import QPainter, QColor, QFont
from PyQt5.QtCore import Qt


class Example(QWidget):
    def __init__(self):
        super().__init__()
        self.initUI()

    def initUI(self):
        self.text = "低头赶路\n敬事如仪"
        self.setGeometry(300, 300, 350, 200)
        self.setWindowTitle('Drawing text')
        self.show()

    def paintEvent(self, event): # 重载⽅法
        qp = QPainter()
        qp.begin(self)
        self.drawText(event, qp)
        qp.end()

    def drawText(self, event, qp):
        qp.setPen(QColor(168, 34, 3))
        qp.setFont(QFont('Decorative', 10))
        qp.drawText(event.rect(), Qt.AlignCenter, self.text)


if __name__ == '__main__':
    app = QApplication(sys.argv)
    ex = Example()
    sys.exit(app.exec_())

QPainter 是低级的绘画类。所有的绘画动作都在这个类的 begin() 和 end() ⽅法之间完成，绘画动作都封装在 drawText() 内部了。

qp.setPen(QColor(168, 34, 3))

qp.setFont(QFont('Decorative', 10))

为文字绘画定义了笔和字体。

drawText() 方法在窗口里绘制文本， rect() 方法返回要更新的矩形区域。

补充：当发生以下情况时会产生绘制事件并调用paintEvent()函数:

1.在窗口部件第一次显示时，系统会自动产生一个绘图事件，从而强制绘制这个窗口部件。（也就是说程序开启时就直接触发了）

2.当重新调整窗口部件的大小时，系统也会产生一个绘制事件。

3.当窗口部件被其他窗口部件遮挡，然后又再次显示出来的时候，就会对那些隐藏的区域产生一个绘制事件。

同时可以调⽤QWidget::update()或者QWidget::repaint()来强制产生⼀个绘制事件。

⼆者的区别是:

repaint()函数会强制产生⼀个即时的重绘事件,而update()函数只是在Qt下⼀次处理事件时才调⽤⼀次绘制事件。如果多次调⽤update(),Qt会把连续多次的绘制事件压缩成⼀个单⼀的绘制事件，这样可避免闪烁现象。点的绘画 QPainter 是低级的绘画类。所有的绘画动作都在这个类的 begin() 和 end() 方法之间完成，绘画动作都封装在 drawText() 内部了。为⽂字绘画定义了笔和字体。 drawText() 方法在窗口里绘制文本， rect() 方法返回要更新的矩形区域。

程序展示：

点的绘画

点是最简单的绘画了。

from PyQt5.QtWidgets import QWidget, QApplication
from PyQt5.QtGui import QPainter
from PyQt5.QtCore import Qt
import sys, random


class Example(QWidget):
    def __init__(self):
        super().__init__()
        self.initUI()

    def initUI(self):
        self.setGeometry(300, 300, 300, 190)
        self.setWindowTitle('Points')
        self.show()

    def paintEvent(self, e): # 程序启动⾃动调⽤
        qp = QPainter()
        qp.begin(self)
        self.drawPoints(qp)
        qp.end()  # end就不⽤加self

    def drawPoints(self, qp):
        qp.setPen(Qt.blue)
        size = self.size()
        for i in range(1000):
            x = random.randint(1, size.width()-1)
            y = random.randint(1, size.height()-1)
            qp.drawPoint(x, y)


if __name__ == '__main__':
    app = QApplication(sys.argv)
    ex = Example()
    sys.exit(app.exec_())

我们在窗口里随机的画出了1000个点。

qp.setPen(Qt.red)

设置笔的蓝色为红色，使用的是预定义好的颜色。

size = self.size()

每次更改窗口大小，都会产生绘画事件，从 size() 方法里获得当前窗口的大小，然后把产生的点随机的分配到窗口的所有位置上。

qp.drawPoint(x, y)

drawPoint() 方法绘图。

程序展示：

颜色

颜色是⼀个物体显示的RGB的混合色。RBG值的范围是0~255。我们有很多方式去定义⼀个颜色，最常见的方式就是RGB和16进制表示法，也可以使用RGBA，增加了⼀个透明度的选项，透明度值的范围是0~1，0代表完全透明。

from PyQt5.QtWidgets import QWidget, QApplication
from PyQt5.QtGui import QPainter, QColor, QBrush
import sys


class Example(QWidget):

    def __init__(self):
        super().__init__()
        self.initUI()

    def initUI(self):
        self.setGeometry(300, 300, 350, 100)
        self.setWindowTitle('Colours')
        self.show()

    def paintEvent(self, e):
        qp = QPainter()
        qp.begin(self)
        self.drawRectangles(qp)
        qp.end()

    def drawRectangles(self, qp):
        col = QColor(0, 0, 0)
        col.setNamedColor('#d4d4d4') # 这个设置的是边框的颜⾊
        qp.setPen(col)
        qp.setBrush(QColor(200, 0, 0))
        qp.drawRect(10, 15, 90, 60)
        qp.setBrush(QColor(255, 80, 0, 160))
        qp.drawRect(130, 15, 90, 60)
        qp.setBrush(QColor(25, 0, 90, 200))
        qp.drawRect(250, 15, 90, 60)

        
if __name__ == '__main__':
    app = QApplication(sys.argv)
    ex = Example()
    sys.exit(app.exec_())

我们画出了三个颜色的矩形。

color = QColor(0, 0, 0)

color.setNamedColor('#d4d4d4')

使用16进制的方式定义⼀个颜色。

qp.setBrush(QColor(200, 0, 0))

qp.drawRect(10, 15, 90, 60)

定义了⼀个笔刷，并画出了⼀个矩形。笔刷是用来画⼀个物体的背景。 drawRect() 有四个参数，分别是矩形的x、y、w、h。然后用笔刷和矩形进行绘画。

程序展示：

QPen

QPen 是基本的绘画对象，能⽤来画直线、曲线、矩形框、椭圆、多边形和其他形状。

from PyQt5.QtWidgets import QWidget, QApplication
from PyQt5.QtGui import QPainter, QPen
from PyQt5.QtCore import Qt
import sys


class Example(QWidget):

    def __init__(self):
        super().__init__()
        self.initUI()

    def initUI(self):
        self.setGeometry(300, 300, 380, 270)
        self.setWindowTitle('Pen styles')
        self.show()

    def paintEvent(self, e):
        qp = QPainter()
        qp.begin(self)
        self.drawLines(qp)
        qp.end()

    def drawLines(self, qp):
        pen = QPen(Qt.black, 2, Qt.SolidLine) # 先设置笔的样式
        qp.setPen(pen) # 有种插上笔芯的感觉
        qp.drawLine(20, 40, 350, 40) # 前两个坐标起点 后两个坐标终点
        pen.setStyle(Qt.DashLine)
        qp.setPen(pen)
        qp.drawLine(20, 80, 350, 80)
        pen.setStyle(Qt.DashDotLine)
        qp.setPen(pen)
        qp.drawLine(20, 120, 350, 120)
        pen.setStyle(Qt.DotLine)
        qp.setPen(pen)
        qp.drawLine(20, 160, 350, 160)
        pen.setStyle(Qt.DashDotDotLine)
        qp.setPen(pen)
        qp.drawLine(20, 200, 250, 200)
        pen.setStyle(Qt.CustomDashLine)
        pen.setDashPattern([1, 4, 5, 4])
        qp.setPen(pen)
        qp.drawLine(20, 240, 350, 240)


if __name__ == '__main__':
    app = QApplication(sys.argv)
    ex = Example()
    sys.exit(app.exec_())

在这个例子里，我们用不同的笔画了6条直线。PyQt5有五个预定义的笔，另外⼀个笔的样式是我们自定义的。

pen = QPen(Qt.black, 2, Qt.SolidLine)

新建⼀个 QPen 对象，设置颜色黑色，宽2像素，这样就能看出来各个笔样式的区别。 Qt.SolidLine 是预定义样式的⼀种。

pen.setStyle(Qt.CustomDashLine)

pen.setDashPattern([1, 4, 5, 4])

qp.setPen(pen)

这⾥我们自定义了⼀个笔的样式。定义为 Qt.CustomDashLine 然后调⽤ setDashPattern() 方法。数字列表是线的样式，要求必须是个数为偶数。奇数位定义的是空格，偶数位为线长，数字越⼤，空格或线长越⼤，比如本例的就是1像素线，4像素空格，5像素线，4像素空格。

程序展示：

QBrush

QBrush 也是图像的⼀个基本元素。是用来填充⼀些物体的背景图⽤的，比如矩形，椭圆，多边形等。有三种类型：预定义、渐变和纹理。

from PyQt5.QtWidgets import QWidget, QApplication
from PyQt5.QtGui import QPainter, QBrush
from PyQt5.QtCore import Qt
import sys


class Example(QWidget):
    def __init__(self):
        super().__init__()
        self.initUI()

    def initUI(self):
        self.setGeometry(300, 300, 355, 280)
        self.setWindowTitle('Brushes')
        self.show()

    def paintEvent(self, e):
        qp = QPainter()
        qp.begin(self)
        self.drawBrushes(qp)
        qp.end()

    def drawBrushes(self, qp):
        brush = QBrush(Qt.SolidPattern)
        qp.setBrush(brush)
        qp.drawRect(10, 15, 90, 60) # 这⾥后两位貌似是⻓和⾼
        brush.setStyle(Qt.Dense1Pattern)
        qp.setBrush(brush)
        qp.drawRect(130, 15, 90, 60)
        brush.setStyle(Qt.Dense2Pattern)
        qp.setBrush(brush)
        qp.drawRect(250, 15, 90, 60)
        brush.setStyle(Qt.DiagCrossPattern)
        qp.setBrush(brush)
        qp.drawRect(10, 105, 90, 60)
        brush.setStyle(Qt.Dense5Pattern)
        qp.setBrush(brush)
        qp.drawRect(130, 105, 90, 60)
        brush.setStyle(Qt.Dense6Pattern)
        qp.setBrush(brush)
        qp.drawRect(250, 105, 90, 60)
        brush.setStyle(Qt.HorPattern)
        qp.setBrush(brush)
        qp.drawRect(10, 195, 90, 60)
        brush.setStyle(Qt.VerPattern)
        qp.setBrush(brush)
        qp.drawRect(130, 195, 90, 60)
        brush.setStyle(Qt.BDiagPattern)
        qp.setBrush(brush)
        qp.drawRect(250, 195, 90, 60)


if __name__ == '__main__':
    app = QApplication(sys.argv)
    ex = Example()
    sys.exit(app.exec_())

我们画了9个不同的矩形。

brush = QBrush(Qt.SolidPattern)

qp.setBrush(brush)

qp.drawRect(10, 15, 90, 60)

创建了⼀个笔刷对象，添加笔刷样式，然后调⽤ drawRect() 方法画图。

程序展示：

贝塞尔曲线

噩梦可以使用PyQt5的 QPainterPath 创建贝塞尔曲线。绘画路径是由许多构建图形的对象，具体表现就是⼀些线的形状，比如矩形，椭圆，线和曲线。

from PyQt5.QtWidgets import QWidget, QApplication
from PyQt5.QtGui import QPainter, QPainterPath
from PyQt5.QtCore import Qt
import sys


class Example(QWidget):

    def __init__(self):
        super().__init__()
        self.initUI()

    def initUI(self):
        self.setGeometry(300, 300, 380, 250)
        self.setWindowTitle('Bézier curve')
        self.show()

    def paintEvent(self, e):
        qp = QPainter()
        qp.begin(self)
        qp.setRenderHint(QPainter.Antialiasing)
        self.drawBezierCurve(qp)
        qp.end()

    def drawBezierCurve(self, qp):
        path = QPainterPath()
        path.moveTo(30, 30)
        path.cubicTo(30, 30, 200, 350, 350, 30)
        qp.drawPath(path)


if __name__ == '__main__':
    app = QApplication(sys.argv)
    ex = Example()
    sys.exit(app.exec_())

这个示例中，我们画出了⼀个贝塞尔曲线。

path = QPainterPath()

path.moveTo(30, 30)

path.cubicTo(30, 30, 200, 350, 350, 30)

用 QPainterPath 路径创建贝塞尔曲线。使用 cubicTo() 方法生成，分别需要三个点：起始点，控制点和终止点。

qp.drawPath(path)

drawPath() 绘制最后的图像。

程序展示：