使用 pyQtGraph 在 pyqt graphicsView 中绘制图像

Question

我尝试对designerExample 进行逆向工程，以使其执行与绘图相同的操作，但对于图像却得到两个结果，均不正确：

1. 如果我将我的 QGraphicsView 提升为 GraphicsView 我会得到图像 已输出，但它不能像您期望的那样移动或缩放 pyQtGraph 中的项目（运行examples 脚本 - 我期待与 GraphicsLayout 示例类似的行为：此示例中的网格中有一个可移动的图像。我的不是即使我基于此示例的代码）

1. 如果我将我的 QGraphicsView 提升为 GraphicsLayoutWidget 我得到 AttributeError: 'QGraphicsView' object has no attribute 'addItem' 我可以在调试器中看到。但是，我看不到的是 调试器是 the GraphicsLayoutWidget should have 的 GraphicsView 属性。此外，GraphicsView 也 没有 addItem 属性，至少不是根据我的 当我在调试器中导航到 ui.graphicsView 时可以看到 断点设置在调用 addItem(img) 之前

代码：

import sys, os
import pyqtgraph as pg
import numpy as np
from PyQt4.QtGui import *

## Define main window class from template
path = os.path.dirname(os.path.abspath(__file__))
uiFile = os.path.join(path, 'pyQtGraphTest.ui')
WindowTemplate, TemplateBaseClass = pg.Qt.loadUiType(uiFile)

class QMainWindow(TemplateBaseClass):
    def __init__(self):
        #super(QtGui.QMainWindow, self).__init__(parent)
        TemplateBaseClass.__init__(self)

        self.ui = WindowTemplate()
        self.ui.setupUi(self)
        self.ui.pushButton.clicked.connect(self.do_it)

    def do_it(self):
        frame = np.random.normal(size=(100,100))
        img = pg.ImageItem(frame)
        self.ui.graphicsView.addItem(img) #BREAKPOINT HERE


if __name__ == '__main__':
    app = QApplication(sys.argv)

    form = QMainWindow()
    form.show()
    app.exec_()

pyQtGraphTest.ui

<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
 <class>MainWindow</class>
 <widget class="QMainWindow" name="MainWindow">
  <property name="geometry">
   <rect>
    <x>0</x>
    <y>0</y>
    <width>632</width>
    <height>614</height>
   </rect>
  </property>
  <property name="windowTitle">
   <string>MainWindow</string>
  </property>
  <widget class="QWidget" name="centralwidget">
   <widget class="QPushButton" name="pushButton">
    <property name="geometry">
     <rect>
      <x>10</x>
      <y>10</y>
      <width>99</width>
      <height>27</height>
     </rect>
    </property>
    <property name="text">
     <string>PushButton</string>
    </property>
   </widget>
   <widget class="GraphicsView" name="graphicsView">
    <property name="geometry">
     <rect>
      <x>20</x>
      <y>50</y>
      <width>571</width>
      <height>501</height>
     </rect>
    </property>
   </widget>
  </widget>
 </widget>
 <customwidgets>
  <customwidget>
   <class>GraphicsView</class>
   <extends>QGraphicsView</extends>
   <header>pyqtgraph.h</header>
  </customwidget>
 </customwidgets>
 <resources/>
 <connections/>
</ui>

Answer 1

参考你引用的例子，GraphicsLayout，它们执行的事件顺序是：

1. 创建一个 GraphicsView
2. 创建一个 GraphicsLayout
3. 将 GraphicsLayout 对象设置为 GraphicsView 中心项
4. 通过 GraphicsLayout.addViewBox 获取 ViewBox 引用
5. 创建图像
6. 将图像添加到 ViewBox

您的代码省略了第 2 步到第 4 步，并将图像直接添加到 GraphicsView（因为您没有在图像想要的位置创建 ViewBox）。

例如，如果您决定在 Designer 中推广 GraphicsLayoutWidget，那也可以，但您应该参考 Plotting.py 示例以了解添加图像的正确顺序。 Plotting.py 示例从调用 pg.GraphicsWindow() 开始，它是 GraphicsLayoutWidget 的子类。

这是您运行示例所需的修复。

class QMainWindow(TemplateBaseClass):
def __init__(self):
    #super(QtGui.QMainWindow, self).__init__(parent)
    TemplateBaseClass.__init__(self)

    self.ui = WindowTemplate()
    self.ui.setupUi(self)
    self.ui.pushButton.clicked.connect(self.do_it)
    self.glayout = pg.GraphicsLayout()
    self.vb = self.glayout.addViewBox()

def do_it(self):
    frame = np.random.normal(size=(100,100))
    img = pg.ImageItem(frame)
    self.ui.graphicsView.setCentralItem(self.glayout)
    self.vb.addItem(img)
    self.vb.autoRange()
    #self.ui.graphicsView.addItem(img) #BREAKPOINT HERE