I see some people say if you want to put QGraphicsScene's origin of coordinates at the origin of QGraphicsView, i.e. top-left corner. You need to let both of them have the same size.
So here is what I do:
import sys
from PyQt5.QtWidgets import QApplication, QGraphicsLineItem,
QGraphicsScene, QGraphicsView
class Demo(QGraphicsView):
def __init__(self):
super(Demo, self).__init__()
self.resize(300, 300)
self.line = QGraphicsLineItem()
self.line.setLine(0, 0, 100, 100)
self.scene = QGraphicsScene()
self.scene.setSceneRect(0, 0, 300, 300)
self.scene.addItem(self.line)
self.setScene(self.scene)
if __name__ == '__main__':
app = QApplication(sys.argv)
demo = Demo()
demo.show()
sys.exit(app.exec_())
The View's size is 300x300 and I use setSceneRect() to make sure the Scene's size is 300x300.
In this case, the Scene's origin is at top-left corner.
However, when I use setSceneRect(0, 0, 150, 150), the origin is not there, but at (75, 75)!
Why? I thought the first two parameters of setSceneRect(x, y, w, h) set where the origin of coordinates should be. When the Scene is smaller than View, how can we make sure the Scene's origin is at the top-left corner?
Any help would be appreciated!
As the docs point out:
alignment : Qt::Alignment
This property holds the alignment of the
scene in the view when the whole scene is visible.
If the whole scene is visible in the view, (i.e., there are no visible
scroll bars,) the view's alignment will decide where the scene will be
rendered in the view. For example, if the alignment is
Qt::AlignCenter, which is default, the scene will be centered in the
view, and if the alignment is (Qt::AlignLeft | Qt::AlignTop), the
scene will be rendered in the top-left corner of the view.
So, by default, the scenerect is centered with the viewport of the QGraphicsView, and in the case of having the same size, the behavior you point out is observed, but in the second case the property of the centering is highlighted.
So the solution is to establish the alignment to:
import sys
from PyQt5.QtWidgets import QApplication, QGraphicsLineItem, QGraphicsScene, QGraphicsView
from PyQt5.QtCore import Qt
class Demo(QGraphicsView):
def __init__(self):
super(Demo, self).__init__()
self.resize(300, 300)
self.line = QGraphicsLineItem()
self.line.setLine(0, 0, 100, 100)
self.scene = QGraphicsScene()
self.scene.setSceneRect(0, 0, 150, 150)
self.scene.addItem(self.line)
self.setScene(self.scene)
self.setAlignment(Qt.AlignTop | Qt.AlignLeft)
if __name__ == '__main__':
app = QApplication(sys.argv)
demo = Demo()
demo.show()
sys.exit(app.exec_())
Explanation:
To understand what the scenerect is first, it must be understood that it is the QGraphicsView and the QGraphicsScene, these concepts are explained with an analogy to the recording of a movie, the QGraphicsView would be the camera, the QGraphicsScene represents what is recorded, ie the scene. The scene is delimited by the sceneRect, if the camera is very close to the scene, its limits will not be observed, but if the camera is far away, the scenerect projection in the camera will not occupy the whole screen, so it will have to be aligned in some position, in the case of QGraphicsView the alignment property is used.
why the scene is no longer centered in the view if I use setSceneRect(50, 50, 150, 150)?
To answer I use the following example where to make the scenerect visible I use a QGraphicsRectItem:
import sys
from PyQt5 import QtCore, QtGui, QtWidgets
class Demo(QtWidgets.QGraphicsView):
def __init__(self):
super(Demo, self).__init__()
self.resize(300, 300)
self.line = QtWidgets.QGraphicsLineItem()
self.line.setLine(0, 0, 100, 100)
self.scene = QtWidgets.QGraphicsScene()
self.scene.setSceneRect(50, 50, 150, 150)
self.scene.addItem(self.line)
rect_item = self.scene.addRect(QtCore.QRectF(50, 50, 150, 150))
rect_item.setPen(QtGui.QPen(QtGui.QColor("green")))
self.setScene(self.scene)
if __name__ == "__main__":
app = QtWidgets.QApplication(sys.argv)
demo = Demo()
demo.show()
sys.exit(app.exec_())
As you can see the alignment is not about QRectF(0, 0, w, h) but the center of QRectF(x, y, w, h) which in this case is (100,100). So keep centered on sceneRect in the QGraphicsView.
Related
I'm designing graphic editor. As a scene for drawing, I need to use exactly QGraphicsScene. I implemented adding rectangles and ellipses to the scene with two buttons.
I need to implement dragging the faigures from the panel to the canvas, approximately as in the picture:Shape Selection Panel
What widgets or buttons can I use for this custom panel? Maybe there is an information an example with the implementation of a similar panel?
The program code with the implementation of adding shapes and the interface image:
from PyQt5.QtWidgets import *
from PyQt5.QtGui import *
from PyQt5.QtCore import *
import sys
# window class
class Window(QMainWindow):
def __init__(self):
super().__init__()
wid = QWidget()
self.setCentralWidget(wid)
# setting title
self.setWindowTitle("Paint with PyQt5")
# setting geometry to main window
self.setGeometry(100, 100, 800, 600)
# Defining a scene rect of 400x200, with it's origin at 0,0.
# If we don't set this on creation, we can set it later with .setSceneRect
self.scene = QGraphicsScene(0, 0, 400, 200)
# Set all items as moveable and selectable.
for item in self.scene.items():
item.setFlag(QGraphicsItem.ItemIsMovable)
item.setFlag(QGraphicsItem.ItemIsSelectable)
# Define our layout.
vbox = QVBoxLayout()
up = QPushButton("Rect")
up.clicked.connect(self.add_rect)
vbox.addWidget(up)
down = QPushButton("Elips")
down.clicked.connect(self.add_elips)
vbox.addWidget(down)
view = QGraphicsView(self.scene)
view.setRenderHint(QPainter.Antialiasing)
hbox = QHBoxLayout(self)
hbox.addLayout(vbox)
hbox.addWidget(view)
wid.setLayout(hbox)
def add_rect(self):
rect = QGraphicsRectItem(0, 0, 200, 50)
rect.setPos(50, 20)
rect.setFlag(QGraphicsItem.ItemIsMovable)
rect.setFlag(QGraphicsItem.ItemIsSelectable)
self.scene.addItem(rect)
def add_elips(self):
ellipse = QGraphicsEllipseItem(0, 0, 100, 100)
ellipse.setPos(75, 30)
ellipse.setFlag(QGraphicsItem.ItemIsMovable)
ellipse.setFlag(QGraphicsItem.ItemIsSelectable)
self.scene.addItem(ellipse)
# create pyqt5 app
App = QApplication(sys.argv)
# create the instance of our Window
window = Window()
# showing the window
window.show()
# start the app
sys.exit(App.exec())
Image of interface:
Image of interface
I am working with OpenGL in python and trying to attach 2d images to a canvas (the images will change according to a certain frequence).
I managed to achieve that but to continue my task i need two things:
the major problem: I need to get the image position (or bounds), sorry if i don't have the correct term, i am new to this. basically i just need to have some kind of positions to know where my picture is in the canvas. i tried to look into the methods and attributes of self.view.camera I could not find anything to help.
one minor problem: i can move the image with the mouse along the canvas and i zoom it. i wonder if it is possible to only allow the zoom but not allow the right/left move [this is resolved in the comments section]
here is my code:
import sys
from PySide2 import QtWidgets, QtCore
from vispy import scene
from PySide2.QtCore import QMetaObject
from PySide2.QtWidgets import *
import numpy as np
import dog
import time
import imageio as iio
class CameraThread(QtCore.QThread):
new_image = QtCore.Signal(object)
def __init__(self, parent=None):
QtCore.QThread.__init__(self, parent)
def run(self):
try:
while True:
frame = iio.imread(dog.getDog(filename='randog'))
self.new_image.emit(frame.data)
time.sleep(10.0)
finally:
print('end!')
class Ui_MainWindow(object):
def setupUi(self, MainWindow):
if not MainWindow.objectName():
MainWindow.setObjectName("MainWindow")
MainWindow.resize(800, 400)
self.centralwidget = QWidget(MainWindow)
self.centralwidget.setObjectName("centralwidget")
self.gridLayout = QGridLayout(self.centralwidget)
self.gridLayout.setObjectName("gridLayout")
self.groupBox = QGroupBox(self.centralwidget)
self.groupBox.setObjectName("groupBox")
self.gridLayout.addWidget(self.groupBox, 0, 0, 1, 1)
MainWindow.setCentralWidget(self.centralwidget)
QMetaObject.connectSlotsByName(MainWindow)
class MainWindow(QtWidgets.QMainWindow):
def __init__(self):
super(MainWindow, self).__init__()
self.ui = Ui_MainWindow()
self.ui.setupUi(self)
# OpenGL drawing surface
self.canvas = scene.SceneCanvas(keys='interactive')
self.canvas.create_native()
self.canvas.native.setParent(self)
self.setWindowTitle('MyApp')
self.view = self.canvas.central_widget.add_view()
self.view.bgcolor = '#ffffff' # set the canvas to a white background
self.image = scene.visuals.Image(np.zeros((1, 1)),
interpolation='nearest',
parent= self.view.scene,
cmap='grays',
clim=(0, 2 ** 8 - 1))
self.view.camera = scene.PanZoomCamera(aspect=1)
self.view.camera.flip = (0, 1, 0)
self.view.camera.set_range()
self.view.camera.zoom(1000, (0, 0))
self._camera_runner = CameraThread(parent=self)
self._camera_runner.new_image.connect(self.new_image, type=QtCore.Qt.BlockingQueuedConnection)
self._camera_runner.start()
#QtCore.Slot(object)
def new_image(self, img):
try:
self.image.set_data(img)
self.image.update()
except Exception as e:
print(f"problem sending image: {e}")
def main():
import ctypes
ctypes.windll.shell32.SetCurrentProcessExplicitAppUserModelID('my_gui')
app = QtWidgets.QApplication([])
main_window = MainWindow()
main_window.show()
sys.exit(app.exec_())
if __name__ == '__main__':
main()
Do you want to know the coordinates of the picture in the viewport (the window), or do you want the coordinates of the picture on the canvas? Vispy actually puts the image at (0,0) by default inside the Vispy canvas. When you move around the canvas you actually aren't moving the canvas around, you are just moving the camera which is looking at the canvas so the coordinates of the picture stay at (0,0) regardless if you move around the viewport or the camera or not. Also the coordinates of the Vispy canvas correspond one to one with the pixel length and width of your image. One pixel is one unit in Vispy. You can check this by adding this method to your MainWindow class:
def my_handler(self,event):
transform = self.image.transforms.get_transform(map_to="canvas")
img_x, img_y = transform.imap(event.pos)[:2]
print(img_x, img_y)
# optionally do the below to tell other handlers not to look at this event:
event.handled = True
and adding this to your __init__ method:
self.canvas.events.mouse_move.connect(self.my_handler)
You can see that when you hover over the top left corner of your image, it should print roughly (0,0).
def my_handler(self,event):
transform = self.image.transforms.get_transform(map_to="canvas")
img_x, img_y = transform.imap(event.pos)[:2]
print(img_x, img_y)
# optionally do the below to tell other handlers not to look at this event:
event.handled = True
Basically I'm trying to draw a border around my frameless window. It's size is 550 and 407. I create my QPainter then my lines and in the end I'm trying to draw them.
def draw_border(self):
painter = QPainter()
painter.begin(self)
pen = QPen(QColor(255, 1, 1))
painter.setPen(pen)
left = QLine(0, 0, 0, 407)
bottom = QLine(0, 407, 550, 407)
right = QLine(550, 407, 550, 0)
painter.drawLine(left)
painter.drawLine(bottom)
painter.drawLine(right)
painter.end()
I expect to have three lines: left, right and bottom, but instead nothing happens.
I can not know where the error is because you do not provide an MCVE, so I will only propose my solution that is to reuse the rect() of the widget so the lines will adapt to the size of the window:
from PySide2 import QtGui, QtCore, QtWidgets
class Widget(QtWidgets.QWidget):
def __init__(self, parent=None):
super(Widget, self).__init__(parent)
self.setWindowFlags(self.windowFlags() | QtCore.Qt.FramelessWindowHint)
def paintEvent(self, event):
painter = QtGui.QPainter(self)
pen = QtGui.QPen(QtGui.QColor(255, 1, 1))
painter.setPen(pen)
width = pen.width()
rect = self.rect().adjusted(0, -width, -width, -width)
painter.drawRect(rect)
if __name__ == "__main__":
import sys
app = QtWidgets.QApplication(sys.argv)
w = Widget()
w.resize(550, 407)
w.show()
sys.exit(app.exec_())
My goal is to write a software that displays two movable disks that live inside the same QGraphicsItemGroup. I'd like to use QGraphicsItemGroup because in this way each disk can access the position of the other. To make the objects movable, I use the flag ItemIsMovable which unfortunately doesn't seem to work inside a QGraphicsItemGroup The following program exemplifies my issue:
import sys
from PyQt5.QtCore import Qt
from PyQt5.QtWidgets import QGraphicsView, QGraphicsScene, QGraphicsItem,\
QApplication, QGraphicsItemGroup, QGraphicsEllipseItem
class MyDisk(QGraphicsEllipseItem):
def __init__(self, top_left_x, top_left_y, radius, color):
super().__init__(top_left_x, top_left_y, radius, radius)
self.setBrush(color)
self.setFlag(QGraphicsItem.ItemIsMovable)
class MyGroup(QGraphicsItemGroup):
def __init__(self):
super().__init__()
self.disk1 = MyDisk(50, 50, 20, Qt.red)
self.disk2 = MyDisk(150, 150, 20, Qt.red)
self.addToGroup(self.disk1)
self.addToGroup(self.disk2)
# self.setFlag(QGraphicsItemGroup.ItemIsMovable)
class MyView(QGraphicsView):
def __init__(self):
super().__init__()
self.scene = QGraphicsScene()
self.setScene(self.scene)
self.setWindowTitle('Red disks are not movable')
self.setSceneRect(0, 0, 250, 250)
self.group = MyGroup()
self.scene.addItem(self.group)
self.scene.addItem(MyDisk(150, 50, 20, Qt.green))
if __name__ == '__main__':
app = QApplication([])
f = MyView()
f.show()
sys.exit(app.exec_())
My problem is that the green disk (not in the group) is movable but the two red disks (in the group) are not. How can I make the two red disks movable? Note that setting the flag ItemIsMovable inside MyGroup doesn't solve the problem because the red disks would then move together (you can try this by uncomment the comment in the code).
I'm using Python 2.7 and PyQt4. I am trying to have a half-circle object that is a QGraphicsItem. I want to be able to move it using the mouse, by clicking and dragging. I can create the object and move it around with the mouse by setting the flag ItemIsMovable. Now the half-circle moves around freely but I want it to move just around the fixed central point. It is difficult to describe, but it should be something similar to a dial. How can I accomplish this?
you can use QGraphicsItem::mouseMoveEvent event to track item's movements within the scene and correct its position once it's moved off the restricted area. Pls, check if an example below would work for you:
import sys
from PyQt4 import QtGui, QtCore
class TestEclipseItem(QtGui.QGraphicsEllipseItem):
def __init__(self, parent=None):
QtGui.QGraphicsPixmapItem.__init__(self, parent)
self.setFlag(QtGui.QGraphicsItem.ItemIsMovable, True)
self.setFlag(QtGui.QGraphicsItem.ItemIsSelectable, True)
# set move restriction rect for the item
self.move_restrict_rect = QtCore.QRectF(20, 20, 200, 200)
# set item's rectangle
self.setRect(QtCore.QRectF(50, 50, 50, 50))
def mouseMoveEvent(self, event):
# check of mouse moved within the restricted area for the item
if self.move_restrict_rect.contains(event.scenePos()):
QtGui.QGraphicsEllipseItem.mouseMoveEvent(self, event)
class MainForm(QtGui.QMainWindow):
def __init__(self, parent=None):
super(MainForm, self).__init__(parent)
scene = QtGui.QGraphicsScene(-50, -50, 600, 600)
ellipseItem = TestEclipseItem()
scene.addItem(ellipseItem)
view = QtGui.QGraphicsView()
view.setScene(scene)
view.setGeometry(QtCore.QRect(0, 0, 400, 200))
self.setCentralWidget(view)
def main():
app = QtGui.QApplication(sys.argv)
form = MainForm()
form.show()
app.exec_()
if __name__ == '__main__':
main()
hope this helps, regards