PyQt5:QGraphicsViewとQGraphicsSceneの大きさの関係

Question

PyQtでのQGraphicsViewとQGraphicsSceneの大きさの関係がよくわかりません。

import sys
from PyQt5.QtWidgets import *
from PyQt5.QtGui import *
from PyQt5.QtCore import *

class Example(QGraphicsItem):
    def __init__(self, width=400, height=400):
        super(Example, self).__init__()

        self.width = width
        self.height = height
        self.x_origin = width / 2
        self.y_origin = height / 2
        self.scale = 20

    def paint(self, painter, option, widget):
        painter.setPen(Qt.black)
        painter.drawLine(0, self.y_origin, self.width, self.y_origin)
        painter.drawLine(self.x_origin, 0, self.x_origin, self.height)
        print("paint")

        for i in range(100):
            x = self.x_origin + i * self.scale
            y = self.y_origin + i * self.scale
            painter.setPen(Qt.black)
            painter.setBrush(QBrush(Qt.red, Qt.SolidPattern))
            painter.drawEllipse(QPointF(x, y), 9, 9)

    def boundingRect(self):
        return QRectF(0, 0, self.width, self.height)

    def setScale(self, x):
        self.scale = x

    def getScale(self):
        return self.scale

    def repaint(self):
        self.update()

class MyWindow(QMainWindow):
    def __init__(self):
        super().__init__()
        self.initUI()

    def initUI(self):
        self.setGeometry(0, 0, 600, 500)
        self.setWindowTitle("Ex")

        self.setWindow()

        self.show()

    def setWindow(self):
        self.w = QWidget()

        self.view = QGraphicsView()
        self.scene = QGraphicsScene(self.view)
        self.srect = self.view.rect()
        width = self.srect.width()
        height = self.srect.height()
        self.scene.setSceneRect(QRectF(self.srect))
        self.graph = Example(width, height)
        self.scene.addItem(self.graph)
        self.view.setScene(self.scene)

        label = QLabel(" X ")
        self.box = QLineEdit()
        x = self.getScale()
        self.box.setText("{}".format(x))
        update = QPushButton('Update')
        update.clicked.connect(self.setScale)

        main = QGridLayout()

        main.addWidget(self.view, 0, 0, 30, 5)
        main.addWidget(label, 0, 10, 1, 3)
        main.addWidget(self.box, 1, 10, 1, 3)
        main.addWidget(update, 2, 10, 1, 3)

        self.w.setLayout(main)
        self.setCentralWidget(self.w)

    def getScale(self):
        return self.graph.getScale()

    def setScale(self):
        self.x = int(self.box.text())
        self.graph.setScale(self.x)
        self.graph.repaint()

def main():
    app = QApplication(sys.argv)
    gui = MyWindow()
    sys.exit(app.exec_())


if __name__ == '__main__':
    main()

現在、以上のような構成でウィンドウを作成していみているのですが、円が見切れる形になっております。

ここで表示されているスクロールバーは、恐らく設定されているviewの大きさ分しか動かすことができないということだと思うのですが、すべての円を表示するためにはどのようにすればよいのでしょうか？
また、右側で用意しているテキストボックスを使用して、円と円の間隔を変えるようにした場合、動的にスクロールバーの長さを変更するようなことはできるのでしょうか？

Answer 1

全部表示されない原因

ここで表示されているスクロールバーは、恐らく設定されているviewの大きさ分しか動かすことができないということだと思うのですが、すべての円を表示するためにはどのようにすればよいのでしょうか？

View の大きさ以上スクロールできないのは、QGraphicsScene の SceneRect にビューの大きさを設定しているからです。

self.scene.setSceneRect(QRectF(self.srect))

これをコメントアウトして、SceneRect を設定しない場合は、QgraphicsScene はアイテムがすべて収まるサイズに QGraphicsScene が拡張されます。
今回は Example という QGraphisItem だけなので、この大きさは

def boundingRect(self):
    return QRectF(0, 0, self.width, self.height)

で定義されています。この self.width, self.height は次のコンストラクタ引数で QGraphicsView のサイズを設定していたので、QGraphicsView のサイズになります。

self.graph = Example(width, height)

すべての円を表示するには

ここで表示されているスクロールバーは、恐らく設定されているviewの大きさ分しか動かすことができないということだと思うのですが、すべての円を表示するためにはどのようにすればよいのでしょうか？
また、右側で用意しているテキストボックスを使用して、円と円の間隔を変えるようにした場合、動的にスクロールバーの長さを変更するようなことはできるのでしょうか？

すべての円が表示されるように Example クラスの def boundingRect(self) が返す Rect を動的に変更する必要があります。

全部表示されるように変更したコード

• 原寸大で表示したい場合は fitInView() の2箇所をコメントアウトしてください。
• GGraphicsItem の大きさ等変更する場合 (scale の変更など) は変更前に prepareGeometryChange() をよんでください。変更が完了したら、update() で再描画すればよいです。

import sys
from PyQt5.QtWidgets import *
from PyQt5.QtGui import *
from PyQt5.QtCore import *


class Example(QGraphicsItem):
    def __init__(self, width=400, height=400):
        super(Example, self).__init__()

        self.width = width
        self.height = height
        self.x_origin = width / 2
        self.y_origin = height / 2
        self.scale = 20

    def paint(self, painter, option, widget):
        painter.setPen(Qt.black)
        painter.drawLine(0, self.y_origin, self.width, self.y_origin)
        painter.drawLine(self.x_origin, 0, self.x_origin, self.height)
        print("paint")

        for i in range(100):
            x = self.x_origin + i * self.scale
            y = self.y_origin + i * self.scale
            painter.setPen(Qt.black)
            painter.setBrush(QBrush(Qt.red, Qt.SolidPattern))
            painter.drawEllipse(QPointF(x, y), 9, 9)

    def boundingRect(self):
        width = self.y_origin + 100 * self.scale + 30
        height = self.y_origin + 100 * self.scale + 30
        return QRectF(0, 0, width, height)

    def setScale(self, x):
        self.prepareGeometryChange()
        self.scale = x
        self.update()

    def getScale(self):
        return self.scale


class MyWindow(QMainWindow):
    def __init__(self):
        super().__init__()
        self.initUI()

    def initUI(self):
        self.setGeometry(50, 50, 600, 500)
        self.setWindowTitle("Ex")
        self.setWindow()
        self.show()

    def setWindow(self):
        self.w = QWidget()
        self.view = QGraphicsView()
        self.scene = QGraphicsScene(self.view)
        self.srect = self.view.rect()
        width = self.srect.width()
        height = self.srect.height()
        # self.scene.setSceneRect(QRectF(self.srect))
        self.graph = Example(width, height)
        self.scene.addItem(self.graph)
        self.view.setScene(self.scene)
        self.view.fitInView(self.scene.sceneRect(), Qt.KeepAspectRatio)

        label = QLabel(" X ")
        self.box = QLineEdit()
        x = self.getScale()
        self.box.setText("{}".format(x))
        update = QPushButton('Update')
        update.clicked.connect(self.setScale)

        main = QGridLayout()
        main.addWidget(self.view, 0, 0, 30, 5)
        main.addWidget(label, 0, 10, 1, 3)
        main.addWidget(self.box, 1, 10, 1, 3)
        main.addWidget(update, 2, 10, 1, 3)

        self.w.setLayout(main)
        self.setCentralWidget(self.w)

    def getScale(self):
        return self.graph.getScale()

    def setScale(self):
        self.x = int(self.box.text())
        self.graph.setScale(self.x)
        self.scene.setSceneRect(self.scene.itemsBoundingRect())
        self.view.fitInView(self.scene.sceneRect(), Qt.KeepAspectRatio)


def main():
    app = QApplication(sys.argv)
    gui = MyWindow()
    sys.exit(app.exec_())


if __name__ == '__main__':
    main()

追記 Qt の情報源

C++ も PyQt もライブラリの使い方は同じで情報量は C++ のほうが多いので、検索するときは PyQt ではなく Qt で調べたほうがいいです。(C++ の文法を知らなくても大丈夫です。)

検索は日本語で出てこなければ、英語のキーワードで調べたほうがいいです。Stack Overflow でだいたい既出です。

• Qt のリファレンス

使用するクラスに関してだけ確認する。

• Stack Overflow / Qt Centre などの質問サイト

例えば、「QGraphicsView の表示スケールを QGraphicsScene がすべて収まるように変更したい」と思った場合は「qgraphicsview auto scale」と検索してみると、

1個目、2個目に答えが出てきます。

Auto scale a QGraphicsView
how to Fit QGraphicsScene in a QGraphicsView

• Qiita などの日本語のサイト

日本語の情報源もそれなりにあります。

Qiita

• 公式の Example

Qt Creator をインストールするとかなりの数の Example がついてきます。

Comments

[Ykkykk]

コードまでご提示いただきありがとうございます。
ご指摘いただいた通り、boundingRect()の返り値を調節するところで詰まっておりました。
このboundingRect()内の操作は、どのような処理になっているのでしょうか？
なぜ「原点＋100×スケール＋30」という処理になるのでしょうか？
また、スケールの変更前にprepareGeometryChange()を呼ぶとのことですが、self.view.scale(2,2)とする前にprepareGeometryChange()を呼ぶという理解で正しいでしょうか？
お手数ですが、ご教示いただけますと幸いです。

[tiitoi]

boundingRect() は、「QGraphicsItem を囲む長方形を返す」という役割があります。
QGraphicsScene 側からは各アイテムの boundingRect() を呼び出して、アイテムの矩形を判断しています。
質問のコードでは、boundingRect() の範囲を超えて楕円を描画しているので、超えた範囲の楕円は表示されないということになります。なので、描画したすべての円を表示したい場合は一番右下の円の座標を boundingRect() の width, height に設定してあげる必要があります。その座標は 原点＋100×スケール＋9 (円の半径) ですが、少し余裕をもたせて +30 としてあります。
あくまでサンプルなので、適宜調整してください。
```
for i in range(100):
x = self.x_origin + i * self.scale
y = self.y_origin + i * self.scale
```

[tiitoi]

prepareGeometryChange() は Example の boundingBox() の大きさが変更されるような場合に変更前によんでください。
たとえば、Example.setScale() でスケールが変更された場合です。
呼び出すのは、Example の中で呼び出せばよいです。

```
def setScale(self, x):
self.prepareGeometryChange() # 変更前に呼ぶ
self.scale = x # スケールを変えたということは boundingBox() も変わる。
self.update() # 再描画リクエスト
```

http://doc.qt.io/qt-5/qgraphicsitem.html#prepareGeometryChange

[Ykkykk]

再度詳細にお教えいただき本当にありがとうございます。
上記二点について確認いたしました。
また、本筋とはそれるのですが、Qtについてどのようにご習得になられたのでしょうか？Qtのリファレンス等を読むことが中心ですか？？

[tiitoi]

追記しました。自分は PyQt でアプリケーションを作ったりしたことはないのですが、C++ の Qt を使って GUI アプリを作成したりします。
リファレンスは量が多いので、「使うクラスだけ読む」という活用法がおすすめです。あと検索するときは「PyQt でなく、Qt で調べる」「英語で調べる」がいいかと思います。

[Ykkykk]

Qtで調べたほうが良いのですね。ありがとうございます。
本筋とは異なる点までご追記いただき本当にありがとうございます！