实现对象在 window 内的对齐,添加来自另一个 .py 文件的图形

Achieving alignment of objects within window, adding graphs from another .py file

因此,我想请教您如何在 PyQt5 中更好地组织多个 buttonsTextBox、图形。以前,有人帮助我使用网格来更好地对齐我放入 My Window.

中的对象

然而,我正在尝试编码的结局离发生还有一段距离。

这是我目前得到的:

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


class Okno(QMainWindow):
    def __init__(self):
        super(Okno, self).__init__()
        self.setGeometry(500, 500, 900, 500)
        self.setWindowTitle("My window")
        self.button1 = QtWidgets.QPushButton()
        self.button2 = QtWidgets.QPushButton()
        self.TextBox1 = QLineEdit(self)  # Parameter self - add text box to my Window "Okno"
        self.TextBox2 = QLineEdit(self)
        self.TextBox3 = QLineEdit(self)
        self.TextBox4 = QLineEdit(self)   # Baudrate
        self.TextBox5 = QLineEdit(self)   # Parity
        self.TB_TEMP_IN = QLineEdit(self)   # Temp_IN
        self.TB_TEMP_OUT = QLineEdit(self)   # Temp_OUT
        self.label1 = QtWidgets.QLabel()  # TextBox1, pressure_IN
        self.label2 = QtWidgets.QLabel()
        self.label3 = QtWidgets.QLabel()
        self.label4 = QtWidgets.QLabel()  # TextBox3, pressure_OUT
        self.label_TEMP_IN = QtWidgets.QLabel()
        self.label_TEMP_OUT = QtWidgets.QLabel()
        self.iniUI()

    # Window objects
    def iniUI(self):
        w = QtWidgets.QWidget()
        self.setCentralWidget(w)
        grid = QtWidgets.QGridLayout(w)

        self.button1.setText("Open file")
        self.button1.setMinimumWidth(150)
        self.button1.clicked.connect(self.open_file)
        self.button2.setText("Exit")
        self.button2.clicked.connect(self.close)

        grid.addWidget(self.button1, 10, 0, QtCore.Qt.AlignLeft | QtCore.Qt.AlignBottom)
        grid.addWidget(self.button2, 10, 6, QtCore.Qt.AlignRight | QtCore.Qt.AlignBottom)

        # Text Box
        grid.addWidget(self.TextBox1, 3, 1, QtCore.Qt.AlignCenter | QtCore.Qt.AlignCenter)

        self.TextBox2.setPlaceholderText("Enter port name")
        grid.addWidget(self.TextBox2, 3, 3, QtCore.Qt.AlignCenter | QtCore.Qt.AlignTop)

        grid.addWidget(self.TextBox3, 3, 6, QtCore.Qt.AlignLeft | QtCore.Qt.AlignCenter)

        self.TextBox4.setPlaceholderText("Baudrate")
        grid.addWidget(self.TextBox4, 3, 3, QtCore.Qt.AlignCenter | QtCore.Qt.AlignCenter)

        self.TextBox5.setPlaceholderText("Parity")
        grid.addWidget(self.TextBox5, 3, 3, QtCore.Qt.AlignCenter | QtCore.Qt.AlignBottom)

        grid.addWidget(self.TB_TEMP_IN, 3, 1, QtCore.Qt.AlignCenter | QtCore.Qt.AlignBottom)
        grid.addWidget(self.TB_TEMP_OUT, 3, 6, QtCore.Qt.AlignCenter | QtCore.Qt.AlignBottom)

        # Label (Text Box name)
        self.label1.setText("Pressure_IN")
        grid.addWidget(self.label1, 3, 0, QtCore.Qt.AlignRight| QtCore.Qt.AlignCenter)

        self.label4.setText("Pressure_OUT")
        grid.addWidget(self.label4, 3, 5, QtCore.Qt.AlignRight | QtCore.Qt.AlignCenter)

        self.label_TEMP_IN.setText("Temp_IN")
        grid.addWidget(self.label_TEMP_IN, 3, 0, QtCore.Qt.AlignRight| QtCore.Qt.AlignBottom)

        self.label_TEMP_OUT.setText("Temp_OUT")
        grid.addWidget(self.label_TEMP_OUT, 3, 5, QtCore.Qt.AlignRight | QtCore.Qt.AlignBottom)

        self.label2.setText("Data Input")
        grid.addWidget(self.label2, 0, 0, QtCore.Qt.AlignLeft | QtCore.Qt.AlignTop)
        self.label2.setStyleSheet('color: red')

        self.label3.setText("Data output")
        grid.addWidget(self.label3, 0, 6, QtCore.Qt.AlignRight | QtCore.Qt.AlignTop)
        self.label3.setStyleSheet('color: blue')

    def open_file(self):
        print("Open file")


def window():
    app = QApplication(sys.argv)
    okno = Okno()
    okno.show()
    sys.exit(app.exec_())


window()

我在使用 Grid 添加更多对象时注意到的一件事是很难将其组织起来。如果我正确理解它是如何工作的,我必须将网格扩展到 10 x 6,但是对齐方式(左、中、右)不会按对齐顺序对对象进行排序,例如由绝对边界定义的行/列。

至于按钮、文本框等的事件,我应该能够对它们进行编程,我只是没有多少 Windows 应用程序的经验,而主要是在控制台应用程序上。

但是,我应该如何将两个图表添加到My Window?我正在使用 matplotlib.pyplot 在另一个 .py 文件中绘制它们,我使用 pandas 从 .xls 文件加载部分数据,另一部分(数据输出)将通过串行(RS232)或TCP/IP接口。我必须实时绘制它们并能够存储它们(作为 .txt 或 .csv,这并不重要)。

能否请您给我一些关于选择 My Window 的正确概念的提示,以实现我在下面附加的示例,并在必要时能够在将来“轻松”添加其他对象。

我绝对认为 window 中的对象越多,就需要更好的组织,因为:方法 iniUI(self) 和 class Okno(QMainWindow) 都变得漂亮了长.

我已经简单说明了我要实现的目标:

在将小部件添加到布局时设置小部件的对齐方式对小部件对齐方式没有影响,但只会影响它们在 布局提供的 space 范围内的对齐方式.此外,许多小部件会自动尝试扩展自己(如 QLabel 或项目视图)。

例如,QLabel 的文本默认居中对齐方式为 left/vertically,因此您需要设置 that 对齐方式,但它仍会尝试扩展其如果其他小部件允许,可用 space。

为了得到你需要的东西,你必须考虑小部件之间的间距,它们的 sizePolicy(代表小部件在布局中使用时的 "willingness" 关于它的大小,如果它有固定大小,能不能grow/expand,能不能缩小等等)。

既然你想要在列之间有一些space,最简单的做法是在布局中保留空列,并设置一个stretch factor on those columns using setColumnStretch(),这样它们就会尽量扩展尽可能。

最后,对于复杂的结构,最好使用 嵌套 布局,这意味着您将为小部件设置主布局和 "child" 布局被添加到其中,因此每个 "section" 都有自己的布局管理器,独立于其他布局管理器。在下面的示例中,我实现了这样的结构:

    +-------------- main vertical layout ---------------+
    |                                                   |
    |  +------------ button grid layout -------------+  |
    |  |title|    |(empty)|      |(empty)|     |title|  |
    |  +-----+----+-------+------+-------+-----+-----+  |
    |  |label|edit|       |input |       |label|edit |  |
    |  +-----+----+-------+------+-------+-----+-----+  |
    |  |label|edit|       |input |       |label|edit |  |
    |  +-----+----+-------+------+-------+-----+-----+  |
    |  |label|edit|       |input |       |label|edit |  |
    |  +-----+----+-------+------+-------+-----+-----+  |
    +---------------------------------------------------+
    |                                                   |
    |  +---------- graph horizontal layout ----------+  |
    |  |                      |                      |  |
    |  |       left graph     |      right graph     |  |
    |  |                      |                      |  |
    |  +----------------------+----------------------+  |
    +---------------------------------------------------+
    |                                                   |
    |  +--------- button horizontal layout ----------+  |
    |  |        |                           |        |  |
    |  | button |         (stretch)         | button |  |
    |  |        |                           |        |  |
    |  +--------+---------------------------+--------+  |
    +---------------------------------------------------+ 

它是这样显示的:

这是代码。请注意,我从 init 中删除了小部件创建(如果您使用 initUi 函数,则在其他地方创建它们没有多大意义)。

from PyQt5 import QtWidgets, QtCore
from matplotlib.figure import Figure
from matplotlib.backends.backend_qt5agg import FigureCanvasQTAgg as FigureCanvas
import sys


class Okno(QtWidgets.QMainWindow):
    def __init__(self):
        super(Okno, self).__init__()
        self.setGeometry(500, 500, 900, 500)
        self.setWindowTitle("My window")
        self.iniUI()

    def iniUI(self):
        w = QtWidgets.QWidget()
        self.setCentralWidget(w)

        mainLayout = QtWidgets.QVBoxLayout(w)

        grid = QtWidgets.QGridLayout()
        mainLayout.addLayout(grid)

        self.dataInputLabel = QtWidgets.QLabel('Data Input')
        grid.addWidget(self.dataInputLabel, 0, 0)
        self.dataInputLabel.setStyleSheet('color: red')

        portSettingLabel = QtWidgets.QLabel('Port setting', alignment=QtCore.Qt.AlignCenter)
        grid.addWidget(portSettingLabel, 0, 3)

        self.dataOutputLabel = QtWidgets.QLabel('Data Output', alignment=QtCore.Qt.AlignRight|QtCore.Qt.AlignVCenter)
        grid.addWidget(self.dataOutputLabel, 0, 6)
        self.dataOutputLabel.setStyleSheet('color: blue')

        # set the vertical policy to Maximum for labels, so they don't try to
        # expand themselves if there's more available space
        for label in (self.dataInputLabel, portSettingLabel, self.dataOutputLabel):
            label.setSizePolicy(QtWidgets.QSizePolicy.Preferred, QtWidgets.QSizePolicy.Maximum)

        grid.addWidget(QtWidgets.QLabel('Pressure [kPa]'), 1, 0)
        self.inputPressure = QtWidgets.QLineEdit(readOnly=True)
        grid.addWidget(self.inputPressure, 1, 1)

        grid.addWidget(QtWidgets.QLabel('Temperature [K]'), 2, 0)
        self.inputTemp = QtWidgets.QLineEdit(readOnly=True)
        grid.addWidget(self.inputTemp, 2, 1)

        grid.addWidget(QtWidgets.QLabel('Humidity [%]'), 3, 0)
        self.inputHumidity = QtWidgets.QLineEdit(readOnly=True)
        grid.addWidget(self.inputHumidity, 3, 1)

        self.portEdit = QtWidgets.QLineEdit(placeholderText='Enter port')
        grid.addWidget(self.portEdit, 1, 3)
        self.baudEdit = QtWidgets.QLineEdit(placeholderText='Baudrate')
        grid.addWidget(self.baudEdit, 2, 3)
        self.parityEdit = QtWidgets.QLineEdit(placeholderText='Parity')
        grid.addWidget(self.parityEdit, 3, 3)

        grid.addWidget(QtWidgets.QLabel('Pressure [kPa]'), 1, 5)
        self.outputPressure = QtWidgets.QLineEdit(readOnly=True)
        grid.addWidget(self.outputPressure, 1, 6)

        grid.addWidget(QtWidgets.QLabel('Temperature [K]'), 2, 5)
        self.outputTemp = QtWidgets.QLineEdit(readOnly=True)
        grid.addWidget(self.outputTemp, 2, 6)

        grid.addWidget(QtWidgets.QLabel('Humidity [%]'), 3, 5)
        self.outputHumidity = QtWidgets.QLineEdit(readOnly=True)
        grid.addWidget(self.outputHumidity, 3, 6)

        grid.setColumnStretch(2, 1)
        grid.setColumnStretch(4, 1)

        graphLayout = QtWidgets.QHBoxLayout()
        mainLayout.addLayout(graphLayout)
        # here insert your graphs...
        self.graphLeft = FigureCanvas(Figure())
        graphLayout.addWidget(self.graphLeft)
        self.graphRight = FigureCanvas(Figure())
        graphLayout.addWidget(self.graphRight)

        buttonLayout = QtWidgets.QHBoxLayout()
        mainLayout.addLayout(buttonLayout)

        self.openButton = QtWidgets.QPushButton('Open file')
        self.openButton.setMinimumWidth(150)
        self.openButton.clicked.connect(self.open_file)
        buttonLayout.addWidget(self.openButton)

        # add an empty "stretch", which acts as an expanding spacer on box layouts
        buttonLayout.addStretch()

        self.exitButton = QtWidgets.QPushButton('Exit')
        self.exitButton.clicked.connect(self.close)
        buttonLayout.addWidget(self.exitButton)

最后,考虑使用 Qt Designer,它对于创建复杂的布局很有用(或者,如果您仍想通过代码完成所有操作,至少在设计过程中可视化它们)。请注意,在这种情况下,您应该遵循 using Designer 上建议的 guidelines(最重要的是,永远不要 编辑使用 pyuic 实用程序),或使用 PyQt5.uic 模块中的 loadUi('yourguifile.ui', self)(其中 self 是您要使用 ui 设置的 widget/window)。