如何在现有的 QGraphicsVIew 中绘图？

Question

就像标题说的那样，我正在尝试在现有的 QGraphicsView 中进行绘制。 我使用 QT Designer 生成的窗口，我想在QGraphicsView内绘制一个 16x16 正方形的矩阵。

这是我现在拥有的代码：

窗户：

# -*- coding: utf-8 -*-
# Form implementation generated from reading ui file 'untitled.ui'
#
# Created by: PyQt5 UI code generator 5.8.2
#
# WARNING! All changes made in this file will be lost!

from PyQt5 import QtCore, QtGui, QtWidgets

class Ui_MainWindow(object):
    def setupUi(self, MainWindow):
        MainWindow.setObjectName("MainWindow")
        MainWindow.resize(911, 567)
        self.centralwidget = QtWidgets.QWidget(MainWindow)
        self.centralwidget.setObjectName("centralwidget")
        self.label = QtWidgets.QLabel(self.centralwidget)
        self.label.setGeometry(QtCore.QRect(20, 10, 301, 31))
        font = QtGui.QFont()
        font.setPointSize(12)
        font.setBold(True)
        font.setWeight(75)
        self.label.setFont(font)
        self.label.setObjectName("label")
        self.groupBox = QtWidgets.QGroupBox(self.centralwidget)
        self.groupBox.setGeometry(QtCore.QRect(620, 40, 271, 91))
        font = QtGui.QFont()
        font.setBold(True)
        font.setWeight(75)
        self.groupBox.setFont(font)
        self.groupBox.setObjectName("groupBox")
        self.rdtest = QtWidgets.QRadioButton(self.groupBox)
        self.rdtest.setGeometry(QtCore.QRect(60, 60, 101, 22))
        self.rdtest.setObjectName("rdtest")
        self.rdtrain = QtWidgets.QRadioButton(self.groupBox)
        self.rdtrain.setGeometry(QtCore.QRect(60, 30, 101, 22))
        self.rdtrain.setObjectName("rdtrain")
        self.graphicsView = QtWidgets.QGraphicsView(self.centralwidget)
        self.graphicsView.setGeometry(QtCore.QRect(10, 40, 601, 411))
        self.graphicsView.setObjectName("graphicsView")
        self.clear = QtWidgets.QPushButton(self.centralwidget)
        self.clear.setGeometry(QtCore.QRect(10, 470, 88, 29))
        self.clear.setObjectName("clear")
        self.trainNewInput = QtWidgets.QPushButton(self.centralwidget)
        self.trainNewInput.setGeometry(QtCore.QRect(500, 470, 111, 29))
        self.trainNewInput.setObjectName("trainNewInput")
        self.trainbox = QtWidgets.QGroupBox(self.centralwidget)
        self.trainbox.setGeometry(QtCore.QRect(620, 150, 271, 171))
        font = QtGui.QFont()
        font.setBold(True)
        font.setWeight(75)
        self.trainbox.setFont(font)
        self.trainbox.setObjectName("trainbox")
        self.vtrain = QtWidgets.QLineEdit(self.trainbox)
        self.vtrain.setGeometry(QtCore.QRect(100, 70, 101, 29))
        self.vtrain.setObjectName("vtrain")
        self.label_2 = QtWidgets.QLabel(self.trainbox)
        self.label_2.setGeometry(QtCore.QRect(40, 70, 56, 31))
        font = QtGui.QFont()
        font.setBold(True)
        font.setWeight(75)
        self.label_2.setFont(font)
        self.label_2.setObjectName("label_2")
        self.trainDefault = QtWidgets.QPushButton(self.trainbox)
        self.trainDefault.setGeometry(QtCore.QRect(40, 30, 161, 29))
        self.trainDefault.setObjectName("trainDefault")
        self.output = QtWidgets.QLabel(self.trainbox)
        self.output.setGeometry(QtCore.QRect(10, 130, 271, 17))
        self.output.setText("")
        self.output.setObjectName("output")
        self.output_2 = QtWidgets.QLabel(self.trainbox)
        self.output_2.setGeometry(QtCore.QRect(10, 150, 271, 17))
        self.output_2.setText("")
        self.output_2.setObjectName("output_2")
        self.testbox = QtWidgets.QGroupBox(self.centralwidget)
        self.testbox.setGeometry(QtCore.QRect(620, 330, 271, 171))
        font = QtGui.QFont()
        font.setBold(True)
        font.setWeight(75)
        self.testbox.setFont(font)
        self.testbox.setObjectName("testbox")
        self.pushButton = QtWidgets.QPushButton(self.testbox)
        self.pushButton.setGeometry(QtCore.QRect(50, 40, 161, 29))
        self.pushButton.setObjectName("pushButton")
        MainWindow.setCentralWidget(self.centralwidget)
        self.menubar = QtWidgets.QMenuBar(MainWindow)
        self.menubar.setGeometry(QtCore.QRect(0, 0, 911, 23))
        self.menubar.setObjectName("menubar")
        MainWindow.setMenuBar(self.menubar)
        self.statusbar = QtWidgets.QStatusBar(MainWindow)
        self.statusbar.setObjectName("statusbar")
        MainWindow.setStatusBar(self.statusbar)

        self.retranslateUi(MainWindow)
        QtCore.QMetaObject.connectSlotsByName(MainWindow)

    def retranslateUi(self, MainWindow):
        _translate = QtCore.QCoreApplication.translate
        MainWindow.setWindowTitle(_translate("MainWindow", "MainWindow"))
        self.label.setText(_translate("MainWindow", "RNA: Numeros "))
        self.groupBox.setTitle(_translate("MainWindow", "Opciones:"))
        self.rdtest.setText(_translate("MainWindow", "Test"))
        self.rdtrain.setText(_translate("MainWindow", "Train"))
        self.clear.setText(_translate("MainWindow", "Clear"))
        self.trainNewInput.setText(_translate("MainWindow", "Train new Input"))
        self.trainbox.setTitle(_translate("MainWindow", "Train:"))
        self.label_2.setText(_translate("MainWindow", "% Test:"))
        self.trainDefault.setText(_translate("MainWindow", "Train Default Data"))
        self.testbox.setTitle(_translate("MainWindow", "Test:"))
        self.pushButton.setText(_translate("MainWindow", "Start Test"))


if __name__ == "__main__":
    import sys
    app = QtWidgets.QApplication(sys.argv)
    MainWindow = QtWidgets.QMainWindow()
    ui = Ui_MainWindow()
    ui.setupUi(MainWindow)
    MainWindow.show()
    sys.exit(app.exec_())

我想在其中创建一个从窗口绘制 QGraphicsView 的方法的逻辑类：

import sys
from PyQt5 import QtCore, QtGui, QtWidgets
from PyQt5.QtWidgets import QGraphicsScene
from PyQt5.QtCore import (QLineF, QPointF, QRectF, Qt)
from PyQt5.QtWidgets import QWidget, QApplication
from PyQt5.QtWidgets import (QApplication, QGraphicsView, QGraphicsScene, QGraphicsItem,
                             QGridLayout, QVBoxLayout, QHBoxLayout,
                             QLabel, QLineEdit, QPushButton)
from window import Ui_MainWindow
from RNA import NumberIA

train = []
train_r = []
test = []
test_r = []


class MyFirstGuiProgram(Ui_MainWindow):
    def __init__(self, dialog):
        Ui_MainWindow.__init__(self)

        self.setupUi(dialog)
        self.rdtrain.setChecked(True)

        # Connect "add" button with a custom function (addInputTextToListbox)
        self.clear.clicked.connect(self.addInputTextToListbox)
        self.trainDefault.clicked.connect(self.t_DefaultData)
        self.rdtest.clicked.connect(self.enableTest)
        self.rdtrain.clicked.connect(self.enableTrain)

    def enableTest(self):
        self.trainbox.setEnabled(False)
        self.trainNewInput.setEnabled(False)
        self.testbox.setEnabled(True)

    def drawSomething(self):
        tes = "f"

    def enableTrain(self):
        self.trainbox.setEnabled(True)
        self.trainNewInput.setEnabled(True)
        self.testbox.setEnabled(False)

    def addInputTextToListbox(self):
        print("Hello world!!!")

    def t_DefaultData(self):
        ann = NumberIA()

        t = self.vtrain.text()
        print("Training data: ", t)

        global train
        global train_r
        global test
        global test_r
        train, train_r, test, test_r = ann.read_file(float(t))
        self.output.setText("Train complete...")

        ann.crear_red(train, train_r)
        accuracy, matrix = ann.probar_red(test, test_r)
        self.output_2.setText("Accuracy: " + str(accuracy * 100) + "%")

        print("Matris de Confusion:")
        print('\n'.join([''.join(['{:4}'.format(item) for item in row])
                         for row in matrix]))


if __name__ == '__main__':
    app = QtWidgets.QApplication(sys.argv)
    MainWindow = QtWidgets.QMainWindow()
    ui = MyFirstGuiProgram(MainWindow)
    MainWindow.show()
    MainWindow.setWindowTitle("RNA: Inteligencia Artificial 2")
    ui.enableTrain()
    sys.exit(app.exec_())

我似乎无法在网上找到有关如何做到这一点的示例，我发现的示例对我来说很模糊，似乎无法弄清楚。

Answer 1

我建议您从QMainWindow继承并实现Ui_MainWindow接口，要在QGraphicsView绘制，您必须使用QGraphicsScene并使用其方法，在这种情况下使用addRect() 。

from PyQt5 import QtCore, QtGui, QtWidgets

class MyFirstGuiProgram(QtWidgets.QMainWindow, Ui_MainWindow):
    def __init__(self, parent=None):
        QtWidgets.QMainWindow.__init__(self, parent=parent)
        self.setupUi(self)
        scene = QtWidgets.QGraphicsScene()
        self.graphicsView.setScene(scene)
        pen = QtGui.QPen(QtCore.Qt.green)

        side = 20

        for i in range(16):
            for j in range(16):
                r = QtCore.QRectF(QtCore.QPointF(i*side, j*side), QtCore.QSizeF(side, side))
                scene.addRect(r, pen)


if __name__ == '__main__':
    import sys
    app = QtWidgets.QApplication(sys.argv)
    w = MyFirstGuiProgram()
    w.show()
    sys.exit(app.exec_())

Answer 2

您也可以通过 QLineF() 绘制它，它从设计的角度提供了更多的控制。

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

def sceneWithPen(grid):

    scene = QGraphicsScene()
    view = QGraphicsView()
    view.setScene(scene)
                                        # Creating line's colors
    red = QColor(qRgb(172, 50, 99))
    blue = QColor(qRgb(50, 150, 203))
                                        # Set length of square's side and number of horizontal and vertical lines
    vLines = 16
    hLines = 16
    side = 30
                                        # Set starting values for loops
    hor = 0
    ver = 0
    subdiv = 16
    leftX,leftY = 0, 0
    rightX, rightY = subdiv*side, 0
    bottomX, bottomY= 0, 0
    topX, topY = 0, subdiv*side

    while ver < vLines:
                                        # Drawing vertical lines
        ver = ver + 1
        vLine = QLineF(bottomX, bottomY, topX, topY)
        bottomX, topX = bottomX + side, topX + side
        scene.addLine(vLine, red)

    while hor < hLines:
                                        #Drawing horizontal lines
        hor = hor + 1
        hLine = QLineF(leftX, leftY, rightX, rightY)
        leftY, rightY = leftY + side, rightY + side
        scene.addLine(hLine, blue)

    grid.addWidget(view)

if __name__ == '__main__':
    app = QApplication(sys.argv)
    w = QWidget()
    grid = QGridLayout()
    sceneWithPen(grid)
    w.setLayout(grid)
    w.show()
    sys.exit(app.exec_())

它会是这样的：

Answer 3

很好的例子@eyllanesc 就在上面给你，这是我碰巧有的另一个小例子，如果你需要像一个简单的徒手画一样。

1. 拥有您的 MainWindow，例如 QMainWindow 或 Qwidget 或...
2. 有一个 QGraphicsView。
3. 使用 QGraphicsScene 设置 QGraphicsView 的场景
4. 拥有自己的 QGraphicsPathItem，以便您可以设置所需的属性。
5. 在场景中实现您想要绘制的内容，因此它知道如何绘制自己。

有了这种方式，您将可以控制多个场景，知道如何独立绘制自己，当然，如果您需要多个场景。

这个例子的逻辑是在 QGraphicsView 内部实现的，你可以将它移动到你的 GraphicsScene。

class MainWindow(QMainWindow):

    central_widget = None
    layout_container = None

    def __init__(self):
        super(MainWindow, self).__init__()
        self.central_widget = QWidget()
        self.layout_container = QVBoxLayout()
        self.central_widget.setLayout(self.layout_container)
        self.setCentralWidget(self.central_widget)
        self.layout_container.addWidget(GraphicsView())

class GraphicsView(QGraphicsView):

    start = None
    end = None
    item = None
    path = None

    def __init__(self):
        super(GraphicsView, self).__init__()
        self.setScene(QGraphicsScene())
        self.path = QPainterPath()
        self.item = GraphicsPathItem()
        self.scene().addItem(self.item)

    def mousePressEvent(self, event):
        self.start = self.mapToScene(event.pos())
        self.path.moveTo(self.start)

    def mouseMoveEvent(self, event):
        self.end = self.mapToScene(event.pos())
        self.path.lineTo(self.end)
        self.start = self.end
        self.item.setPath(self.path)

class GraphicsPathItem(QGraphicsPathItem):

    def __init__(self):
        super(GraphicsPathItem, self).__init__()
        pen = QPen()
        pen.setColor(Qt.black)
        pen.setWidth(10)
        self.setPen(pen)

if __name__ == '__main__':
    app = QApplication(sys.argv)
    mw = MainWindow()
    mw.show()
    sys.exit(app.exec_())