# PyQt5 中的繪圖 > 原文： [http://zetcode.com/gui/pyqt5/painting/](http://zetcode.com/gui/pyqt5/painting/) PyQt5 繪圖系統能夠呈現向量圖形，圖像和輪廓基于字體的文本。 當我們想要更改或增強現有的小部件，或者從頭開始創建自定義小部件時，應用中需要繪圖。 要進行繪制，我們使用 PyQt5 工具包提供的繪制 API。 ## `QPainter` `QPainter`在小部件和其他繪圖設備上執行低級繪圖。 它可以繪制從簡單的線條到復雜形狀的所有內容。 ## `paintEvent`方法 繪圖是在`paintEvent()`方法中完成的。 繪圖代碼位于`QPainter`對象的`begin()`和`end()`方法之間。 它在小部件和其他繪圖設備上執行低級繪圖。 ## 繪制文字 我們首先在窗口的客戶區域上繪制一些 Unicode 文本。 `drawingtext.py` ```py #!/usr/bin/python3 # -*- coding: utf-8 -*- """ ZetCode PyQt5 tutorial In this example, we draw text in Russian Cylliric. Author: Jan Bodnar Website: zetcode.com Last edited: August 2017 """ 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, 280, 170) 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_()) ``` 在我們的示例中，我們以西里爾字母繪制一些文本。 文本在垂直和水平方向上對齊。 ```py def paintEvent(self, event): ... ``` 繪制是在繪畫事件中完成的。 ```py qp = QPainter() qp.begin(self) self.drawText(event, qp) qp.end() ``` `QPainter`類負責所有低級繪圖。 所有繪圖方法都在`begin()`和`end()`方法之間。 實際繪圖將委托給`drawText()`方法。 ```py qp.setPen(QColor(168, 34, 3)) qp.setFont(QFont('Decorative', 10)) ``` 在這里，我們定義了用于繪制文本的筆和字體。 ```py qp.drawText(event.rect(), Qt.AlignCenter, self.text) ``` `drawText()`方法在窗口上繪制文本。 繪畫事件的`rect()`方法返回需要更新的矩形。 使用`Qt.AlignCenter`，我們可以在兩個維度上對齊文本。  圖：繪制文本 ## 繪制點 點是可以繪制的最簡單的圖形對象。 這是窗口上的一個小地方。 `points.py` ```py #!/usr/bin/python3 # -*- coding: utf-8 -*- """ ZetCode PyQt5 tutorial In the example, we draw randomly 1000 red points on the window. Author: Jan Bodnar Website: zetcode.com Last edited: August 2017 """ 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() def drawPoints(self, qp): qp.setPen(Qt.red) 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 個紅點。 ```py qp.setPen(Qt.red) ``` 我們將筆設置為紅色。 我們使用預定義的`Qt.red`顏色常量。 ```py size = self.size() ``` 每次我們調整窗口大小時，都會生成一個繪制事件。 我們使用`size()`方法獲得窗口的當前大小。 我們使用窗口的大小將點分布在整個窗口的客戶區域中。 ```py qp.drawPoint(x, y) ``` 我們用`drawPoint()`方法畫點。  圖：點 ## 顏色 顏色是代表紅色，綠色和藍色（RGB）強度值的組合的對象。 有效的 RGB 值在 0 到 255 之間。我們可以通過多種方式定義顏色。 最常見的是 RGB 十進制值或十六進制值。 我們還可以使用代表紅色，綠色，藍色和 Alpha 的 RGBA 值。 在這里，我們添加了一些有關透明度的額外信息。 Alpha 值為 255 表示完全不透明，0 表示完全透明，例如顏色是不可見的。 `colours.py` ```py #!/usr/bin/python3 # -*- coding: utf-8 -*- """ ZetCode PyQt5 tutorial This example draws three rectangles in three #different colours. Author: Jan Bodnar Website: zetcode.com Last edited: August 2017 """ 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_()) ``` 在我們的示例中，我們繪制了三個彩色矩形。 ```py color = QColor(0, 0, 0) color.setNamedColor('#d4d4d4') ``` 在這里，我們使用十六進制符號定義顏色。 ```py qp.setBrush(QColor(200, 0, 0)) qp.drawRect(10, 15, 90, 60) ``` 在這里，我們定義了一個畫筆并繪制了一個矩形。筆刷是用于繪制形狀背景的基本圖形對象。 `drawRect()`方法接受四個參數。 前兩個是軸上的 x 和 y 值。 第三個和第四個參數是矩形的寬度和高度。 該方法使用當前的筆和畫筆繪制矩形。  圖：顏色 ## 筆 `QPen`是基本圖形對象。 它用于繪制矩形，橢圓形，多邊形或其他形狀的線，曲線和輪廓。 `pens.py` ```py #!/usr/bin/python3 # -*- coding: utf-8 -*- """ ZetCode PyQt5 tutorial In this example we draw 6 lines using different pen styles. Author: Jan Bodnar Website: zetcode.com Last edited: August 2017 """ 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, 280, 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, 250, 40) pen.setStyle(Qt.DashLine) qp.setPen(pen) qp.drawLine(20, 80, 250, 80) pen.setStyle(Qt.DashDotLine) qp.setPen(pen) qp.drawLine(20, 120, 250, 120) pen.setStyle(Qt.DotLine) qp.setPen(pen) qp.drawLine(20, 160, 250, 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, 250, 240) if __name__ == '__main__': app = QApplication(sys.argv) ex = Example() sys.exit(app.exec_()) ``` 在我們的示例中，我們繪制了六條線。 線條以六種不同的筆樣式繪制。 有五種預定義的筆樣式。 我們還可以創建自定義筆樣式。 最后一行是使用自定義筆樣式繪制的。 ```py pen = QPen(Qt.black, 2, Qt.SolidLine) ``` 我們創建一個`QPen`對象。 顏色是黑色。 寬度設置為 2 像素，以便我們可以看到筆樣式之間的差異。 `Qt.SolidLine`是預定義的筆樣式之一。 ```py pen.setStyle(Qt.CustomDashLine) pen.setDashPattern([1, 4, 5, 4]) qp.setPen(pen) ``` 在這里，我們定義了自定義筆樣式。 我們設置`Qt.CustomDashLine`筆樣式并調用`setDashPattern()`方法。 數字列表定義樣式。 數字必須是偶數。 奇數定義筆劃線，偶數空格。 數字越大，空格或筆劃線越大。 我們的模式是 1px 筆劃線，4px 間隔，5px 筆劃線，4px 間隔等。  圖：筆的樣式 ## `QBrush` `QBrush`是基本圖形對象。 它用于繪制圖形形狀的背景，例如矩形，橢圓形或多邊形。 筆刷可以具有三種不同類型：預定義筆刷，漸變或紋理圖案。 `brushes.py` ```py #!/usr/bin/python3 # -*- coding: utf-8 -*- """ ZetCode PyQt5 tutorial This example draws nine rectangles in different brush styles. Author: Jan Bodnar Website: zetcode.com Last edited: August 2017 """ 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_()) ``` 在我們的示例中，我們繪制了九個不同的矩形。 ```py brush = QBrush(Qt.SolidPattern) qp.setBrush(brush) qp.drawRect(10, 15, 90, 60) ``` 我們定義一個筆刷對象。 我們將其設置為繪畫器對象，并通過調用`drawRect()`方法繪制矩形。  圖：筆刷 ## 貝塞爾曲線 貝塞爾曲線是一條三次曲線。 可以使用`QPainterPath`創建 PyQt5 中的貝塞爾曲線。 畫家路徑是由許多圖形構造塊（例如矩形，橢圓形，直線和曲線）組成的對象。 `beziercurve.py` ```py #!/usr/bin/python3 # -*- coding: utf-8 -*- """ ZetCode PyQt5 tutorial This program draws a Bézier curve with QPainterPath. Author: Jan Bodnar Website: zetcode.com Last edited: August 2017 """ 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_()) ``` 本示例繪制了貝塞爾曲線。 ```py path = QPainterPath() path.moveTo(30, 30) path.cubicTo(30, 30, 200, 350, 350, 30) ``` 我們使用`QPainterPath`路徑創建貝塞爾曲線。 曲線是通過`cubicTo()`方法創建的，該方法需要三個點：起點，控制點和終點。 ```py qp.drawPath(path) ``` 使用`drawPath()`方法繪制最終路徑。  圖：貝塞爾曲線 在 PyQt5 教程的這一部分中，我們做了一些基本的繪圖。