How do I keep drawing on image after window resize in PyQt?

Question

I have written a code to draw a rectangle on an image in a QGraphicsView but if I resize the image, for example full screen, the position of the rectangle becomes misplaced. Is there any way to fix this? I think one possible solution is to align the image every time in top left corner but I cannot give 2 arguments in setAlignment().

Here is the code:(the buttons are just for show atm)

class MyWidget(QWidget):
def __init__(self):
    super().__init__()

    self.b1 = QPushButton('Next Image')
    self.b2 = QPushButton('Crop')
    self.b3 = QPushButton('Clear')

    self.view = GraphicsView()
    h_box = QHBoxLayout()
    v_box = QVBoxLayout()
    v_box.addWidget(self.b1)
    v_box.addWidget(self.b2)
    v_box.addWidget(self.b3)
    h_box.addWidget(self.view)
    h_box.addLayout(v_box)
    self.setLayout(h_box)
    #self.resize(800, 800)
    self.setWindowTitle("Super Duper Cropper")

    self.show()



class GraphicsView(QGraphicsView):

def __init__(self):
    super().__init__()
    self.setScene(QGraphicsScene())

    self.item = QGraphicsPixmapItem(QPixmap('test.jpg'))
    self.scene().addItem(self.item)



def mousePressEvent(self, event):
    self.xi = event.x()
    self.yi = event.y()

def mouseMoveEvent(self, event):
    self.xf = event.x()
    self.yf = event.y()
    self.draw_rect()


def mouseReleaseEvent(self, event):
    self.xf = event.x()
    self.yf = event.y()
    self.draw_rect()

def draw_rect(self):
    self.scene().removeItem(self.item)
    self.scene().addItem(self.item)

    self.scene().addRect(self.xi, self.yi, self.xf-self.xi, self.yf-self.yi, pen=QPen(QColor(51, 153, 255), 2,
                        Qt.SolidLine), brush=QBrush(QColor(0, 255, 0, 40)))



if __name__ == '__main__':
    app = QApplication(sys.argv)
    window = MyWidget()
    window.show()
    app.aboutToQuit.connect(app.deleteLater)
    sys.exit(app.exec_())

Answer 1

You have the following errors:

• The coordinates of the scene are different from the coordinates of the view, so you must use the mapToScene() method if you want to establish the right position of the rectangle.

• Why do you add and remove the items? the best thing is to reuse

• You want the position of the rectangle to be relative to the QGraphicsPixmapItem, so the rectangle has to be a child of the QGraphicsPixmapItem.

Using the above we obtain the following:

class GraphicsView(QGraphicsView):
    def __init__(self):
        super().__init__()
        self.setScene(QGraphicsScene())
        self.item = QGraphicsPixmapItem(QPixmap('test.jpg'))
        self.scene().addItem(self.item)
        self.rect_item = QGraphicsRectItem(QRectF(), self.item)
        self.rect_item.setPen(QPen(QColor(51, 153, 255), 2, Qt.SolidLine))
        self.rect_item.setBrush(QBrush(QColor(0, 255, 0, 40)))

    def mousePressEvent(self, event):
        self.pi = self.mapToScene(event.pos())
        super().mousePressEvent(event)

    def mouseMoveEvent(self, event):
        pf = self.mapToScene(event.pos())
        if (self.pi - pf).manhattanLength() > QApplication.startDragDistance():
            self.pf = pf
            self.draw_rect()
        super().mouseMoveEvent(event)

    def mouseReleaseEvent(self, event):
        pf = self.mapToScene(event.pos())
        if (self.pi - pf).manhattanLength() > QApplication.startDragDistance():
            self.pf = pf
            self.draw_rect()
        super().mouseReleaseEvent(event)

    def draw_rect(self):
        r = QRectF(self.pi, self.pf).normalized()
        r = self.rect_item.mapFromScene(r).boundingRect()
        self.rect_item.setRect(r)