Develop Reference

draw on the lower part of the window PyQt5

I am trying to make a program the paints on the half button of the screen only, but as you can see the painting is shifted towards the bottom, if I draw in the upper part, the paint happens in the lower part.
What I want is to draw directly in the bottom part.
here is my code:
from PIL.ImageEnhance import Color
from PyQt5.QtWidgets import QMainWindow, QApplication, QMenu, QMenuBar, QAction, QFileDialog, QTextEdit, QVBoxLayout, \
QWidget, QLabel
from PyQt5.QtGui import QIcon, QImage, QPainter, QPen, QBrush, QPixmap
from PyQt5.QtCore import Qt, QPoint, QSize, QRect
import sys
import pyautogui
class Window(QMainWindow):
def __init__(self):
super().__init__()
title = "Digital Waraq"
icon = "icons/pain.png"
[x, y] = pyautogui.size()
self.setWindowTitle(title)
self.setGeometry(0, 0, x, y)
self.setWindowIcon(QIcon(icon))
self.image = QImage(pyautogui.size().width, int(pyautogui.size().height/2), QImage.Format_RGB32)
self.image.fill(Qt.gray)
self.drawing = False
self.brushSize = 2
self.brushColor = Qt.black
self.lastPoint = QPoint()
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() & Qt.LeftButton) & self.drawing:
painter = QPainter(self.image)
painter.setPen(QPen(self.brushColor, self.brushSize, Qt.SolidLine, Qt.RoundCap, Qt.RoundJoin))
painter.drawLine(self.lastPoint, event.pos())
self.lastPoint = event.pos()
self.update()
def mouseReleaseEvent(self, event):
if event.button() == Qt.LeftButton:
self.drawing = False
def paintEvent(self, event):
canvasPainter = QPainter(self)
#canvasPainter.drawImage(self.rect(), self.image, self.image.rect())
newRect = QRect(QPoint(0, int(pyautogui.size().height/2)), QSize(self.image.size()))
#canvasPainter.drawImage(newRect, self.image, self.image.rect())
canvasPainter.drawImage(newRect, self.image, self.image.rect())
if __name__ == "__main__":
app = QApplication(sys.argv)
window = Window()
window.show()
sys.exit(app.exec())

Do not complicate the task dividing the painting area within the widget, a simpler solution is to create a widget where the painting is done completely and then place it at the bottom of the main window.
import sys
from PyQt5.QtCore import QPoint, Qt
from PyQt5.QtGui import QBrush, QGuiApplication, QImage, QPainter, QPen
from PyQt5.QtWidgets import QApplication, QMainWindow, QVBoxLayout, QWidget
class Drawer(QWidget):
def __init__(self, parent=None):
super().__init__(parent)
self._drawing = False
self.last_point = QPoint()
self._image_layer = QImage(self.size(), QImage.Format_RGB32)
self._image_layer.fill(Qt.gray)
self.brushSize = 2
self.brushColor = Qt.black
def mousePressEvent(self, event):
self._drawing = True
self.last_point = event.pos()
def mouseMoveEvent(self, event):
if self._drawing and event.buttons() & Qt.LeftButton:
painter = QPainter(self._image_layer)
painter.setPen(
QPen(
self.brushColor,
self.brushSize,
Qt.SolidLine,
Qt.RoundCap,
Qt.RoundJoin,
)
)
painter.drawLine(self.last_point, event.pos())
self.last_point = event.pos()
self.update()
def mouseReleaseEvent(self, event):
self._drawing = True
def paintEvent(self, event):
painter = QPainter(self)
painter.drawImage(QPoint(), self._image_layer)
painter.end()
def resizeEvent(self, event):
if (
self.size().width() > self._image_layer.width()
or self.size().height() > self._image_layer.height()
):
qimg = QImage(
max(self.size().width(), self._image_layer.width()),
max(self.size().height(), self._image_layer.height()),
QImage.Format_RGB32,
)
qimg.fill(Qt.gray)
painter = QPainter(qimg)
painter.drawImage(QPoint(), self._image_layer)
painter.end()
self._image_layer = qimg
self.update()
class Window(QMainWindow):
def __init__(self, parent=None):
super().__init__(parent)
self.drawer = Drawer()
central_widget = QWidget()
self.setCentralWidget(central_widget)
vlay = QVBoxLayout(central_widget)
vlay.setContentsMargins(0, 0, 0, 0)
vlay.addStretch(1)
vlay.addWidget(self.drawer, stretch=1)
r = QGuiApplication.primaryScreen().availableGeometry()
self.setGeometry(r)
if __name__ == "__main__":
app = QApplication(sys.argv)
window = Window()
window.show()
sys.exit(app.exec())

How to show a preview of the line I'm drawing with QPainter in PyQt5

My code is drawing lines on a QImage using mousePressEvent and mouseReleaseEvent. It works fine but I would like a dynamic preview line to appear when I'm drawing the said line (ie on MouseMoveEvent). Right now the line just appears when I release the left mouse button and I can't see what I'm drawing.
I want the preview of the line to appear and update as I move my mouse, and only "fixate" when I release the left mouse button. Exactly like the MS Paint Line tool : https://youtu.be/YIw9ybdoM6o?t=207
Here is my code (it is derived from the Scribble Example):
from PyQt5.QtCore import QPoint, QRect, QSize, Qt
from PyQt5.QtGui import QImage, QPainter, QPen, QColor, qRgb
from PyQt5.QtWidgets import QApplication, QWidget, QMainWindow
import sys
class DrawingArea(QWidget):
def __init__(self, parent=None):
super(DrawingArea, self).__init__(parent)
self.setAttribute(Qt.WA_StaticContents)
self.scribbling = False
self.myPenWidth = 1
self.myPenColor = QColor('#000000')
self.image = QImage()
self.startPoint = QPoint()
def mousePressEvent(self, event):
if event.button() == Qt.LeftButton:
self.startPoint = event.pos()
self.scribbling = True
def mouseReleaseEvent(self, event):
if event.button() == Qt.LeftButton and self.scribbling:
self.drawLineTo(event.pos())
self.scribbling = False
def paintEvent(self, event):
painter = QPainter(self)
dirtyRect = event.rect()
painter.drawImage(dirtyRect, self.image, dirtyRect)
def resizeEvent(self, event):
if self.width() > self.image.width() or self.height() > self.image.height():
newWidth = max(self.width() + 128, self.image.width())
newHeight = max(self.height() + 128, self.image.height())
self.resizeImage(self.image, QSize(newWidth, newHeight))
self.update()
super(DrawingArea, self).resizeEvent(event)
def drawLineTo(self, endPoint):
painter = QPainter(self.image)
painter.setPen(QPen(self.myPenColor, self.myPenWidth, Qt.SolidLine, Qt.RoundCap, Qt.RoundJoin))
painter.drawLine(self.startPoint, endPoint)
rad = self.myPenWidth / 2 + 2
self.update(QRect(self.startPoint, endPoint).normalized().adjusted(-rad, -rad, +rad, +rad))
def resizeImage(self, image, newSize):
if image.size() == newSize:
return
newImage = QImage(newSize, QImage.Format_RGB32)
newImage.fill(qRgb(255, 255, 255))
painter = QPainter(newImage)
painter.drawImage(QPoint(0, 0), image)
self.image = newImage
class MainWindow(QMainWindow):
def __init__(self, parent=None):
QMainWindow.__init__(self, parent)
self.setCentralWidget(DrawingArea())
self.show()
def main():
app = QApplication(sys.argv)
ex = MainWindow()
sys.exit(app.exec_())
if __name__ == '__main__':
main()
I can't figure out how to show the preview of the line I'm drawing and I haven't found a suitable answer yet. How can I go about doing this ?

You can draw the lines just within the paintEvent() method instead than directly on the image, then paint on the image when the mouse is actually released.
class DrawingArea(QWidget):
def __init__(self, parent=None):
super(DrawingArea, self).__init__(parent)
self.setAttribute(Qt.WA_StaticContents)
self.scribbling = False
self.myPenWidth = 1
self.myPenColor = QColor('#000000')
self.image = QImage()
self.startPoint = self.endPoint = None
def mousePressEvent(self, event):
if event.button() == Qt.LeftButton:
self.startPoint = event.pos()
def mouseMoveEvent(self, event):
if self.startPoint:
self.endPoint = event.pos()
self.update()
def mouseReleaseEvent(self, event):
if self.startPoint and self.endPoint:
self.updateImage()
def paintEvent(self, event):
painter = QPainter(self)
dirtyRect = event.rect()
painter.drawImage(dirtyRect, self.image, dirtyRect)
if self.startPoint and self.endPoint:
painter.drawLine(self.startPoint, self.endPoint)
def updateImage(self):
if self.startPoint and self.endPoint:
painter = QPainter(self.image)
painter.setPen(QPen(self.myPenColor, self.myPenWidth, Qt.SolidLine, Qt.RoundCap, Qt.RoundJoin))
painter.drawLine(self.startPoint, self.endPoint)
painter.end()
self.startPoint = self.endPoint = None
self.update()
Note that you don't need to call update() within the resize event, as it's automatically called.
I also removed the unnecessary update rect calls, as it's almost useless in this case: specifying a rectangle in which the update should happen is usually done when very complex widgets are drawn (especially when lots of computations are executed to correctly draw everything and only a small part of the widget actually needs updates). In your case, it's almost more time consuming to compute the actual update rectangle than painting all the contents of the widget.

I think this page shows some really nice solutions for the problem of yours. For example, it shows how to implement a custom class which actually gives you a "drawing board":
class Canvas(QLabel):
def __init__(self):
super().__init__()
pixmap = QtGui.QPixmap(600, 300)
self.setPixmap(pixmap)
self.last_x, self.last_y = None, None
self.pen_color = QtGui.QColor('#000000')
def set_pen_color(self, c):
self.pen_color = QtGui.QColor(c)
def mouseMoveEvent(self, e):
if self.last_x is None: # First event.
self.last_x = e.x()
self.last_y = e.y()
return # Ignore the first time.
painter = QtGui.QPainter(self.pixmap())
p = painter.pen()
p.setWidth(1)
p.setColor(self.pen_color)
painter.setPen(p)
painter.drawLine(self.last_x, self.last_y, e.x(), e.y())
painter.end()
self.update()
# Update the origin for next time.
self.last_x = e.x()
self.last_y = e.y()
def mouseReleaseEvent(self, e):
self.last_x = None
self.last_y = None
You can use this Canvas class (or whatever name you would give it) everywhere you need. For example in the MainWindow:
class MainWindow(QMainWindow):
def __init__(self, parent=None):
QMainWindow.__init__(self, parent)
self.canvas = Canvas()
self.canvas.set_pen_color('#fffee5') # set the colour you want
self.setCentralWidget(self.canvas)
self.show()
Hope this could help! Happy coding! :)

How to draw polyline with PyQt5 in Python?

I want to draw polyline with mouse event. But I can't set endpoints by clicking, or choose pen type. I want to draw linear lines, but when i write this code it only shows dots instead of drawing a line. Here is my code:
import sys
from PyQt5 import QtWidgets, QtCore
from PyQt5.QtGui import QPainter, QBrush, QColor, QPen, QPainterPath
from PyQt5.QtWidgets import QLabel, QGraphicsScene, QGraphicsView
class MyWidget(QtWidgets.QWidget):
def __init__(self):
super().__init__()
self.begin = QtCore.QPoint()
self.end = QtCore.QPoint()
self.beginList = []
self.endList = []
self.initUI()
def initUI(self):
self.setGeometry(200, 200, 1000, 500)
self.label = QLabel(self)
self.label.resize(500, 40)
self.show()
def paintEvent(self, event):
qp = QPainter(self)
for i,j in zip(self.beginList, self.endList):
qp.drawLines(QtCore.QLineF(i,j))
def mouseMoveEvent(self, event):
self.begin = event.pos()
self.end = event.pos()
self.beginList.append(self.begin)
self.endList.append(self.end)
self.label.setText('Coordinates: ( %d : %d )' % (event.x(), event.y()))
self.update()
def mouseReleaseEvent(self, event):
self.begin = event.pos()
self.end = event.pos()
if __name__ == '__main__':
app = QtWidgets.QApplication(sys.argv)
window = MyWidget()
window.resize(800,600)
sys.exit(app.exec_())

If the OP code is analyzed, the starting point and the end point coincide, so when drawing a line between 2 points of the same location, only one point will be drawn. The logic is to join the point obtained in the i-th step with the (i+1)-th point.
To do the above the simplest thing is to use a QPainterPath:
import sys
from PyQt5 import QtWidgets, QtGui, QtCore
class MyWidget(QtWidgets.QWidget):
def __init__(self):
super().__init__()
self.initUI()
self.paths = []
def initUI(self):
self.setGeometry(200, 200, 1000, 500)
self.label = QtWidgets.QLabel(self)
self.show()
def paintEvent(self, event):
qp = QtGui.QPainter(self)
for path in self.paths:
qp.drawPath(path)
def mousePressEvent(self, event):
path = QtGui.QPainterPath()
path.moveTo(event.pos())
self.paths.append(path)
super().mousePressEvent(event)
def mouseMoveEvent(self, event):
self.paths[-1].lineTo(event.pos())
self.label.setText('Coordinates: ( %d : %d )' % (event.x(), event.y()))
self.label.adjustSize()
self.update()
super().mouseMoveEvent(event)
def mouseReleaseEvent(self, event):
self.paths[-1].lineTo(event.pos())
self.update()
super().mouseReleaseEvent(event)
if __name__ == "__main__":
app = QtWidgets.QApplication(sys.argv)
window = MyWidget()
window.resize(800, 600)
sys.exit(app.exec_())

PyQt5: drawing multiple rectangles using events

I am creating a desktop application using PyQt5 where the user will be able to draw rectangles.
User should be able to select the top-left corner of the rectangle with first mouse click and the bottom-right corner with second mouse click. A rectangle should appear in that location with the perimeter well defined. I created application but have a problem when I draw another rectangle previous rectangle vanishes. I am not able to draw multiple rectangles.
Please find the below code for reference
import sys
from PyQt5.QtWidgets import *
from PyQt5 import QtGui, QtCore
from PyQt5.QtGui import QPainter, QPen, QBrush
from PyQt5.QtCore import Qt
class Windo(QWidget):
def __init__(self):
super().__init__()
self.setGeometry(150,250,500,500)
self.setWindowTitle("Ammyyy")
self.setWindowIcon(QtGui.QIcon('a.jpeg'))
self.begin = QtCore.QPoint()
self.end = QtCore.QPoint()
self.show()
def paintEvent(self,event):
qp = QPainter(self)
qp.begin(self)
qp.setPen(QPen(Qt.black, 6, Qt.SolidLine))
qp.drawRect(QtCore.QRect(self.begin, self.end))
qp.end()
def mousePressEvent(self, event):
self.begin = event.pos()
self.end = event.pos()
def mouseMoveEvent(self, event):
self.end = event.pos()
self.update()
def mouseReleaseEvent(self, event):
self.begin = event.pos()
self.end = event.pos()
app = QApplication(sys.argv)
win = Windo()
sys.exit(app.exec_())

If you want to draw n-rectangles then you must save that information in a list through QRect. On the other hand, the selection of 2 points does not imply that the QRect is valid, for example if the first point is on the right, the second point will not create a valid rectangle so that rectangle has to be normalized. Considering the above, the solution is:
import sys
from PyQt5.QtCore import Qt, QPoint, QRect
from PyQt5.QtGui import QPainter, QPen, QBrush, QIcon
from PyQt5.QtWidgets import QApplication, QWidget
class Window(QWidget):
def __init__(self):
super().__init__()
self.setGeometry(150, 250, 500, 500)
self.setWindowTitle("Ammyyy")
self.setWindowIcon(QIcon("a.jpeg"))
self.begin = QPoint()
self.end = QPoint()
self.rectangles = []
def paintEvent(self, event):
qp = QPainter(self)
qp.setPen(QPen(Qt.black, 6, Qt.SolidLine))
for rectangle in self.rectangles:
qp.drawRect(rectangle)
if not self.begin.isNull() and not self.end.isNull():
qp.drawRect(QRect(self.begin, self.end).normalized())
def mousePressEvent(self, event):
self.begin = self.end = event.pos()
self.update()
super().mousePressEvent(event)
def mouseMoveEvent(self, event):
self.end = event.pos()
self.update()
super().mouseMoveEvent(event)
def mouseReleaseEvent(self, event):
r = QRect(self.begin, self.end).normalized()
self.rectangles.append(r)
self.begin = self.end = QPoint()
self.update()
super().mouseReleaseEvent(event)
if __name__ == "__main__":
app = QApplication(sys.argv)
win = Window()
win.show()
sys.exit(app.exec_())

Can't stop drawing rectangles in qgraphicsview

In my program I can select a button that sets self.rectmode=1. Once that variable is set to 1 it draws rectangles using mouse events on the qgraphicsview. After pressing a button to set self.rectmode=0 the program continues to draw rectangles using the mouse events. Am I missing some line to end the rectangle drawing event. My code is below thanks in advance:
def mousePressEvent(self, event):
if (self.rectmode==1 and event.button() == Qt.LeftButton and not self._photo.pixmap().isNull()):
self.origin = event.pos()
self.rubberBand.setGeometry(QRect(self.origin, QSize()))
self.rectChanged.emit(self.rubberBand.geometry())
self.rubberBand.show()
self.changeRubberBand = True
else:
super(PhotoViewer, self).mousePressEvent(event)
def mouseMoveEvent(self, event):
if self.rectmode==1 and self.changeRubberBand:
self.rubberBand.setGeometry(QRect(self.origin, event.pos()).normalized())
self.rectChanged.emit(self.rubberBand.geometry())
else:
super(PhotoViewer, self).mouseMoveEvent(event)
def mouseReleaseEvent(self, event):
if self.rectmode==1 and event.button() == Qt.LeftButton:
self.changeRubberBand = False
self.endpoint = event.pos()
print(self.origin.x())
print(self.origin.y())
print(self.endpoint.x())
print(self.endpoint.y())
else:
super(PhotoViewer, self).mouseReleaseEvent(event)

In your code rectmode is always 1, I think that is what's causing the problem, here is a working example, I also removed the variable changeRubberBand because the same can be achieved with only the variable rectMode:
import sys
from PyQt5.Qt import QApplication, QRect, QSize, Qt, QRubberBand, QVBoxLayout, pyqtSignal
from PyQt5.QtWidgets import QMainWindow
class PhotoViewer(QMainWindow):
rectChanged = pyqtSignal(QRect)
def __init__(self):
super().__init__()
self.origin = None
self.endpoint = None
self.rectMode = 0
self.setFixedSize(1024, 768)
self.layout = QVBoxLayout(self)
self.rubberBand = QRubberBand(QRubberBand.Rectangle, self)
self.rubberBand.hide()
self.layout.addChildWidget(self.rubberBand)
def mousePressEvent(self, event):
if self.rectMode == 0 and event.button() == Qt.LeftButton:
self.origin = event.pos()
self.rubberBand.setGeometry(QRect(self.origin, QSize()))
self.rectChanged.emit(self.rubberBand.geometry())
self.rubberBand.show()
self.rectMode = 1
else:
super(PhotoViewer, self).mousePressEvent(event)
def mouseMoveEvent(self, event):
if self.rectMode == 1:
self.rubberBand.setGeometry(QRect(self.origin, event.pos()).normalized())
self.rectChanged.emit(self.rubberBand.geometry())
else:
super(PhotoViewer, self).mouseMoveEvent(event)
def mouseReleaseEvent(self, event):
if self.rectMode == 1 and event.button() == Qt.LeftButton:
self.rectMode = 0
self.endpoint = event.pos()
print(self.origin.x())
print(self.origin.y())
print(self.endpoint.x())
print(self.endpoint.y())
else:
super(PhotoViewer, self).mouseReleaseEvent(event)
if __name__ == '__main__':
app = QApplication(sys.argv)
mainWindow = PhotoViewer()
mainWindow.show()
sys.exit(app.exec_())
Hope it helps.