将图像插入QGridLayout并在PyQt5中的图像上方绘制 [英] Insert Image into QGridLayout and Draw on top of image in PyQt5

问题描述

我对PyQt还是很陌生，并且正在尝试创建一个应用程序，该应用程序的左侧可以绘制QPixmap，右侧可以绘制QTextEdit(用于简单的OCR GUI). 我在看: PyQt5图像和QGridlayout 但是我无法将其与下面的代码连接(我的头发被所有头部抓挠掉了！！) 当我尝试修改以下代码时，得到的是以QPixmap为背景的QMainWindow，可以用鼠标在其上绘制，而第二次出现的QPixmap则在其正确位置上，无法对其进行绘制.有人可以告诉我我在做什么错吗? 非常感谢你！

I'm pretty new to PyQt and am trying to make an application with a QPixmap on the left, which can be drawn on, and a QTextEdit on the right (for a simple OCR GUI). I looked at: PyQt5 Image and QGridlayout but I couldn't connect it with the code below (I'm losing my hair with all the head scratching!!) When I try adapting the following code, what I get is a QMainWindow with the QPixmap as the background which can be drawn on with the mouse and a second occurance of the QPixmap in it's correct position, which can not be drawn on. Can someone tell me what I'm doing wrong? Thank you very much!

# https://stackoverflow.com/questions/51475306/
import sys
from PyQt5.QtCore import Qt, QPoint
from PyQt5.QtWidgets import QMainWindow, QApplication,QGridLayout, QLabel, QWidget, QTextEdit
from PyQt5.QtGui import QPixmap, QPainter, QPen

class Menu(QMainWindow):

    def __init__(self):
        super().__init__()
        self.drawing = False
        self.lastPoint = QPoint()
        self.image = QPixmap("S3.png")
        self.setGeometry(100, 100, 500, 300)
        self.resize(self.image.width(), self.image.height()) 
        layout = QGridLayout()
# Add a QTextEdit box 
        self.edit = QTextEdit()
        layout.addWidget(self.edit, 0, 0, 10, 20)
# This:
# https://stackoverflow.com/questions/52616553
# indicates that a QPixmap must be put into a label to insert into a QGridLayout
        self.label = QLabel()
        self.label.setPixmap(self.image)
        layout.addWidget(self.label, 10, 20, 10, 20)

# https://stackoverflow.com/questions/37304684/
        self.widget = QWidget()
        self.widget.setLayout(layout)
        self.setCentralWidget(self.widget)

        self.show()

    def paintEvent(self, event):
        painter = QPainter(self)
        painter.drawPixmap(self.rect(), self.image)

    def mousePressEvent(self, event):
        if event.button() == Qt.LeftButton:
            self.drawing = True
            self.lastPoint = event.pos()
            print(self.lastPoint)

    def mouseMoveEvent(self, event):
        if event.buttons() and Qt.LeftButton and self.drawing:
            painter = QPainter(self.image)
            painter.setPen(QPen(Qt.red, 3, Qt.SolidLine))
            painter.drawLine(self.lastPoint, event.pos())
            print(self.lastPoint,event.pos())
            self.lastPoint = event.pos()
            self.update()

     def mouseReleaseEvent(self, event):
         if event.button == Qt.LeftButton:
             self.drawing = False

if __name__ == '__main__':
    app = QApplication(sys.argv)
    mainMenu = Menu()
    sys.exit(app.exec_())

推荐答案

每个小部件都必须完成特定的任务，因此我创建了一个仅具有绘画功能的小部件，主小部件用作绘画小部件的容器，并且QTextEdit.

Each widget must fulfill a specific task, so I have created a widget that only has the painted function, the main widget works as a container for the painting widget and the QTextEdit.

from PyQt5 import QtCore, QtGui, QtWidgets


class Label(QtWidgets.QWidget):
    def __init__(self, parent=None):
        super(Label, self).__init__(parent)
        self.image = QtGui.QPixmap("S3.png")
        self.drawing = False
        self.lastPoint = QtCore.QPoint()

    def paintEvent(self, event):
        painter = QtGui.QPainter(self)
        painter.drawPixmap(QtCore.QPoint(), self.image)

    def mousePressEvent(self, event):
        if event.button() == QtCore.Qt.LeftButton:
            self.drawing = True
            self.lastPoint = event.pos()

    def mouseMoveEvent(self, event):
        if event.buttons() and QtCore.Qt.LeftButton and self.drawing:
            painter = QtGui.QPainter(self.image)
            painter.setPen(QtGui.QPen(QtCore.Qt.red, 3, QtCore.Qt.SolidLine))
            painter.drawLine(self.lastPoint, event.pos())
            self.lastPoint = event.pos()
            self.update()

    def mouseReleaseEvent(self, event):
        if event.button == QtCore.Qt.LeftButton:
            self.drawing = False

    def sizeHint(self):
        return self.image.size()


class MainWindow(QtWidgets.QMainWindow):
    def __init__(self, parent=None):
        super().__init__(parent)

        self.label = Label()
        self.textedit = QtWidgets.QTextEdit()

        widget = QtWidgets.QWidget()
        self.setCentralWidget(widget)
        lay = QtWidgets.QHBoxLayout(widget)
        lay.addWidget(self.label, alignment=QtCore.Qt.AlignCenter)
        lay.addWidget(self.textedit)


if __name__ == "__main__":
    import sys

    app = QtWidgets.QApplication(sys.argv)
    w = MainWindow()
    w.show()
    sys.exit(app.exec_())

这篇关于将图像插入QGridLayout并在PyQt5中的图像上方绘制的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！