将 pyqtgraph 图嵌入到 QT .ui 中? [英] Embed a pyqtgraph plot into a QT .ui?

问题描述

首先，我希望你对我有耐心，因为我是这些项目的新手，我也希望不要问愚蠢的问题.话虽如此，我的主要目标是为 raspberry pi 3 创建一个 UI，它将检测来自电池和太阳能电池板的电压、电流等.

由于我正在研究树莓并且对 Python3 有一些了解，所以我决定使用 QTCreator，据我所知，它可以通过 pyqt 翻译成 python3(

2. 然后我们右键单击它并选择提升到..的选项:

3. 在对话框中，我们将 CustomWidget 放在 Promoted Class Name 和 Plotter.h 放在 Header File 中，然后按添加和推广按钮.

4. 然后我们将 .ui 文件转换为 .py

first of all I hope you have me some patience since I'm new on these kind of projects and I also hope not to be asking dumb questions. That being said, my main objective is to create a UI for a raspberry pi 3 which will sense voltage, current, etc from a battery and from a solar panel.

Since I'm working on a raspberry and have some knowledge on Python3, I decided to use QTCreator which as I understand can be translated into python3 through pyqt (https://nikolak.com/pyqt-qt-designer-getting-started/). I installed it on my raspberry pi and made the following UI:

after having a basic UI, I converted the .ui file into .py with the pyuic5 command and I'm able to open the UI with "python3 main.py" and everything seems right:

how the UI looks after opening the main.py file

Now, I want to have a several plots (like voltage against time, etc) on the UI. I'm using the following for testing:

import sys
import pyqtgraph as pg
from pyqtgraph.Qt import QtCore, QtGui
import numpy as np

pg.setConfigOption('background', 'w')
pg.setConfigOption('foreground', 'k')
win = pg.GraphicsWindow()
win.setWindowTitle('pyqtgraph example: Scrolling Plots')


p1 = win.addPlot(labels =  {'left':'Voltage', 'bottom':'Time'})
data1 = np.random.normal(size=10)
data2 = np.random.normal(size=10)
curve1 = p1.plot(data1, pen=(3,3))
curve2 = p1.plot(data2, pen=(2,3))
ptr1 = 0

def update1():
    global data1, curve1, data2, ptr1

    data1[:-1] = data1[1:]  # shift data in the array one sample left
                            # (see also: np.roll)
    data1[-1] = np.random.normal()
    ptr1 += 1

    curve1.setData(data1)
    curve1.setPos(ptr1,0)



    data2[:-1] = data2[1:]  # shift data in the array one sample left
                            # (see also: np.roll)
    data2[-1] = np.random.normal()
    curve2.setData(data2)
    curve2.setPos(ptr1,0)


def update():
    update1()

timer = pg.QtCore.QTimer()
timer.timeout.connect(update)
timer.start(2000) # number of seconds (every 1000) for next update



if __name__ == '__main__':
    QtGui.QApplication.instance().exec_()

Is it possible to embbed that plot into my main.py file? If I understood correctly, I'm supposed to use the promoting widget functionality on QTCreator. Thanks in advance guys!

解决方案

What is promoted through Qt Designer is a Widget, ie a class, so it can not be directly promoted, what we must do is place it inside a class as shown below:

Plotter.py

class  CustomWidget(pg.GraphicsWindow):
    pg.setConfigOption('background', 'w')
    pg.setConfigOption('foreground', 'k')
    ptr1 = 0
    def __init__(self, parent=None, **kargs):
        pg.GraphicsWindow.__init__(self, **kargs)
        self.setParent(parent)
        self.setWindowTitle('pyqtgraph example: Scrolling Plots')
        p1 = self.addPlot(labels =  {'left':'Voltage', 'bottom':'Time'})
        self.data1 = np.random.normal(size=10)
        self.data2 = np.random.normal(size=10)
        self.curve1 = p1.plot(self.data1, pen=(3,3))
        self.curve2 = p1.plot(self.data2, pen=(2,3))

        timer = pg.QtCore.QTimer(self)
        timer.timeout.connect(self.update)
        timer.start(2000) # number of seconds (every 1000) for next update

    def update(self):
        self.data1[:-1] = self.data1[1:]  # shift data in the array one sample left
                            # (see also: np.roll)
        self.data1[-1] = np.random.normal()
        self.ptr1 += 1
        self.curve1.setData(self.data1)
        self.curve1.setPos(self.ptr1, 0)
        self.data2[:-1] = self.data2[1:]  # shift data in the array one sample left
                            # (see also: np.roll)
        self.data2[-1] = np.random.normal()
        self.curve2.setData(self.data2)
        self.curve2.setPos(self.ptr1,0)

if __name__ == '__main__':
    w = CustomWidget()
    w.show()
    QtGui.QApplication.instance().exec_()

Before proceeding I will assume that the files have the following structure:

.
├── main.py
└── Plotter.py

1. The first thing to do is choose the widget:

2. Then we right click on this and choose the option to promote to..:

3. In the dialog box we place CustomWidget in Promoted Class Name and Plotter.h in Header File, then press the Add and Promote button.

4. Then we convert our .ui file to .py

这篇关于将 pyqtgraph 图嵌入到 QT .ui 中?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！