Graphics and Painting in PyQt5

In this PyQt5 article we want to learn about Graphics and Painting in PyQt5, when you are building GUI applications, sometimes you may need to draw something on the screen, for drawing in PyQt5 we can use QPainter class, and also we know that PyQt5 is one of the most popular GUI Frameworks in Python, and also PyQt5 provides powerful tools for creating graphics and painting in your applications.

First of you need to install PyQt5 and you can use pip for that.

pip install PyQt5

1	pip install PyQt5

PyQt5 Basic Drawing

Now let’s start from basic drawing, in this code we are going to create a custom widget by subclassing QWidget and override its paintEvent method. in this method, we can use QPainter to perform drawing operations. this a simple example that draws a rectangle on the widget:

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

class CustomWidget(QWidget):
    def paintEvent(self, event):
        painter = QPainter(self)
        painter.setPen(QColor(0, 0, 0))
        painter.setBrush(QColor(255, 0, 0))
        painter.drawRect(10, 10, 100, 100)

app = QApplication([])
widget = CustomWidget()
widget.show()
app.exec_()

from PyQt5.QtWidgets import QApplication, QWidget

from PyQt5.QtGui import QPainter, QColor

class CustomWidget(QWidget):

def paintEvent(self, event):

painter = QPainter(self)

painter.setPen(QColor(0, 0, 0))

painter.setBrush(QColor(255, 0, 0))

painter.drawRect(10, 10, 100, 100)

app = QApplication([])

widget = CustomWidget()

widget.show()

app.exec_()

In this example, we have created a CustomWidget class that overrides the paintEvent method. after that we create a QPainter object and set the pen and brush properties to define the drawing style. and lastly we call drawRect to draw a rectangle on the widget.

Run the complete code and this will be the result

Handling PyQt5 Mouse Events

Graphics applications often need to respond to user interactions such as mouse clicks and movements. PyQt5 provides event handlers for mouse events that can be overridden to add custom behavior. Let’s extend our previous example to respond to a mouse click:

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

class CustomWidget(QWidget):
    def __init__(self):
        super().__init__()
        self.setMouseTracking(True)  # Enable mouse tracking

    def paintEvent(self, event):
        painter = QPainter(self)
        painter.setPen(QColor(0, 0, 0))
        painter.setBrush(QColor(255, 0, 0))
        painter.drawRect(10, 10, 100, 100)

    def mousePressEvent(self, event):
        if event.button() == Qt.LeftButton:
            print("Left button clicked!")

app = QApplication([])
widget = CustomWidget()
widget.show()
sys.exit(app.exec_())

import sys

from PyQt5.QtWidgets import QApplication, QWidget

from PyQt5.QtGui import QPainter, QColor

from PyQt5.QtCore import Qt

class CustomWidget(QWidget):

def __init__(self):

super().__init__()

self.setMouseTracking(True) # Enable mouse tracking

def paintEvent(self, event):

painter = QPainter(self)

painter.setPen(QColor(0, 0, 0))

painter.setBrush(QColor(255, 0, 0))

painter.drawRect(10, 10, 100, 100)

def mousePressEvent(self, event):

if event.button() == Qt.LeftButton:

print("Left button clicked!")

app = QApplication([])

widget = CustomWidget()

widget.show()

sys.exit(app.exec_())

PyQt5 Advanced Drawing

PyQt5 provides different drawing primitives and features for advanced graphics. You can draw lines, polygons, ellipses and even images. this is an example of drawing some more shapes.

from PyQt5.QtWidgets import QApplication, QWidget
from PyQt5.QtGui import QPainter, QColor, QPolygon, QImage
from PyQt5.QtCore import QPoint

class CustomWidget(QWidget):
    def paintEvent(self, event):
        painter = QPainter(self)
        painter.setPen(QColor(0, 0, 0))
        painter.setBrush(QColor(255, 0, 0))

        # Draw a rectangle
        painter.drawRect(10, 10, 100, 100)

        # Draw a line
        painter.drawLine(10, 10, 100, 100)

        # Draw a polygon
        polygon = QPolygon([QPoint(200, 10), QPoint(250, 110), QPoint(300, 10)])
        painter.setBrush(QColor(0, 255, 0))
        painter.drawPolygon(polygon)

        # Draw an ellipse
        painter.setBrush(QColor(0, 0, 255))
        painter.drawEllipse(150, 150, 100, 50)

        # Draw an image
        image = QImage("python.png")
        painter.drawImage(300, 200, image)

app = QApplication([])
widget = CustomWidget()
widget.show()
app.exec_()

from PyQt5.QtWidgets import QApplication, QWidget

from PyQt5.QtGui import QPainter, QColor, QPolygon, QImage

from PyQt5.QtCore import QPoint

class CustomWidget(QWidget):

def paintEvent(self, event):

painter = QPainter(self)

painter.setPen(QColor(0, 0, 0))

painter.setBrush(QColor(255, 0, 0))

# Draw a rectangle

painter.drawRect(10, 10, 100, 100)

# Draw a line

painter.drawLine(10, 10, 100, 100)

# Draw a polygon

polygon = QPolygon([QPoint(200, 10), QPoint(250, 110), QPoint(300, 10)])

painter.setBrush(QColor(0, 255, 0))

painter.drawPolygon(polygon)

# Draw an ellipse

painter.setBrush(QColor(0, 0, 255))

painter.drawEllipse(150, 150, 100, 50)

# Draw an image

image = QImage("python.png")

painter.drawImage(300, 200, image)

app = QApplication([])

widget = CustomWidget()

widget.show()

app.exec_()

In this example, we have added four additional drawing operations:

drawPolygon: We create a QPolygon object with a set of QPoint vertices and use it to draw a polygon on the widget.
drawEllipse: We specify the bounding rectangle coordinates and draw an ellipse within it.
drawImage: We load an image using the QImage class and draw it on the widget at the specified position.

Run the complete code and this is the result