Search code examples
pythonuser-interfacepyqtdrawingqpainter

Using QPainter and paintEvent to draw circles on a Pixmap that is contained in a QLabel in PYQT5


I'm pretty new to PYQT5 and I wanted to draw a circle on a Pixmap that is contained in a QLabel in the MainWindow UI on PYQT5 with this code:

from PyQt5 import QtCore, QtGui, QtWidgets

background_image_path = '001_01_01_041_05.png'

class Ui_MainWindow(object):
    def setupUi(self, MainWindow):
    MainWindow.setObjectName("MainWindow")
    MainWindow.resize(800, 600)
    self.centralwidget = QtWidgets.QWidget(MainWindow)
    self.centralwidget.setObjectName("centralwidget")
    self.label = QtWidgets.QLabel(self.centralwidget)
    self.label.setGeometry(QtCore.QRect(60, 60, 331, 401))
    self.label.setObjectName("label")
    MainWindow.setCentralWidget(self.centralwidget)
    self.menubar = QtWidgets.QMenuBar(MainWindow)
    self.menubar.setGeometry(QtCore.QRect(0, 0, 800, 28))
    self.menubar.setObjectName("menubar")
    MainWindow.setMenuBar(self.menubar)
    self.statusbar = QtWidgets.QStatusBar(MainWindow)
    self.statusbar.setObjectName("statusbar")
    MainWindow.setStatusBar(self.statusbar)

    self._image = QtGui.QPixmap(background_image_path)

    self.retranslateUi(MainWindow)
    QtCore.QMetaObject.connectSlotsByName(MainWindow)

def retranslateUi(self, MainWindow):
    _translate = QtCore.QCoreApplication.translate
    MainWindow.setWindowTitle(_translate("MainWindow", "MainWindow"))
    self.label.setPixmap(self._image)

def paintEvent(self, event):
    painter = QtGui.QPainter(self._image)
    painter.drawPixmap(self.rect(), self._image)
    pen = QtGui.QPen()
    pen.setWidth(5)
    painter.setPen(pen)
    painter.drawEllipse(300, 300, 70, 70)


if __name__ == "__main__":
    import sys
    app = QtWidgets.QApplication(sys.argv)
    MainWindow = QtWidgets.QMainWindow()
    ui = Ui_MainWindow()
    ui.setupUi(MainWindow)
    MainWindow.show()
    sys.exit(app.exec_())

However, I cannot get the paintEvent(self, event) function to get called. When I did get to call paintEvent(self, event), I could not see the circle being drawn onto the pixmap. I tried setting the QPainter to the Pixmap itself (in painter = QtGui.QPainter(self._image)), but that did not work either.

What did I do incorrectly?

The code below works, which is what my code is based on:

from PyQt5 import QtWidgets, QtGui, QtCore
background_image_path = '001_01_01_041_05.png'

class ImageScroller(QtWidgets.QWidget):
    def __init__(self):


def paintEvent(self, event):
    painter = QtGui.QPainter(self)
    painter.drawPixmap(self.rect(), self._image)
    pen = QtGui.QPen()
    pen.setWidth(5)
    painter.setPen(pen)
    painter.drawEllipse(300, 300, 70, 70)


if __name__ == '__main__':
    import sys
    app = QtWidgets.QApplication(sys.argv)
    w = ImageScroller()
    w.resize(640, 480)
    w.show()
    sys.exit(app.exec_())

Any thoughts or advice would be greatly appreciated!


Solution

  • You missed a couple of lines. Try it:

    from PyQt5 import QtWidgets, QtGui, QtCore
    
    background_image_path = 'E:/_Qt/img/heart.png'     # '001_01_01_041_05.png'
    
    class ImageScroller(QtWidgets.QWidget):                    
        def __init__(self):
            super().__init__()                                   # <-------
    
            self._image = QtGui.QPixmap(background_image_path)   # <-------
    
        def paintEvent(self, event):
            painter = QtGui.QPainter(self)
            painter.drawPixmap(self.rect(), self._image)
            pen = QtGui.QPen()
            pen.setWidth(5)
            painter.setPen(pen)
            painter.drawEllipse(300, 300, 70, 70)
    
    
    if __name__ == '__main__':
        import sys
        app = QtWidgets.QApplication(sys.argv)
        w = ImageScroller()
        w.resize(640, 480)
        w.show()
        sys.exit(app.exec_())
    

    enter image description here

    The real problem here is that you are editing the module generated by pyuic, which is always a very bad idea. Try it:

    from PyQt5 import QtCore, QtGui, QtWidgets
    
    background_image_path = 'E:/_Qt/img/heart.png'
    
    class Ui_MainWindow(object):          
        def setupUi(self, MainWindow):
            MainWindow.setObjectName("MainWindow")
            MainWindow.resize(800, 600)
            self.centralwidget = QtWidgets.QWidget(MainWindow)
            self.centralwidget.setObjectName("centralwidget")
    
            self.label = QtWidgets.QLabel(self.centralwidget)
            self.label.setGeometry(QtCore.QRect(200, 0, 760, 560))
            self.label.setObjectName("label")
    
            MainWindow.setCentralWidget(self.centralwidget)
            self.menubar = QtWidgets.QMenuBar(MainWindow)
            self.menubar.setGeometry(QtCore.QRect(0, 0, 800, 28))
            self.menubar.setObjectName("menubar")
            MainWindow.setMenuBar(self.menubar)
            self.statusbar = QtWidgets.QStatusBar(MainWindow)
            self.statusbar.setObjectName("statusbar")
            MainWindow.setStatusBar(self.statusbar)
    
    #        self._image = QtGui.QPixmap(background_image_path)
    
            self.retranslateUi(MainWindow)
            QtCore.QMetaObject.connectSlotsByName(MainWindow)
    
        def retranslateUi(self, MainWindow):
            _translate = QtCore.QCoreApplication.translate
            MainWindow.setWindowTitle(_translate("MainWindow", "MainWindow"))
    #        self.label.setPixmap(self._image)
            self.label.setText(_translate("MainWindow", 
                               """
                               It is not recommended to modify the design file, 
                               it is appropriate to create another file 
                               to join the logic with the design.
                               """))
    
    
    
    #    def paintEvent(self, event):
    #        painter = QtGui.QPainter(self._image)
    #        painter.drawPixmap(self.rect(), self._image)
    #        pen = QtGui.QPen()
    #        pen.setWidth(5)
    #        painter.setPen(pen)
    #        painter.drawEllipse(300, 300, 70, 70)
    
    
    class MyApp(QtWidgets.QMainWindow, Ui_MainWindow):
    
        def __init__(self):
            super(MyApp, self).__init__()
    
            self.setupUi(self)
    
            self._image = QtGui.QPixmap(background_image_path)
    
        def paintEvent(self, event):
            painter = QtGui.QPainter(self)  
            painter.drawPixmap(self.rect(), self._image)
    
            #pen = QtGui.QPen()
            #pen.setWidth(5)
            #painter.setPen(pen)
            painter.setPen(QtGui.QPen(QtCore.Qt.blue, 5))
            painter.drawEllipse(350, 350, 70, 70)
    
    
    if __name__ == "__main__":
        import sys
        app = QtWidgets.QApplication(sys.argv)
    
    #    MainWindow = QtWidgets.QMainWindow()
    #    ui = Ui_MainWindow()
    #    ui.setupUi(MainWindow)
    #    MainWindow.show()
        window = MyApp()
        window.show() 
    
        sys.exit(app.exec_())
    

    enter image description here