PyQt5 - 正确地动态调整大小和布局组件

Question

我正在尝试使GUI显示（并最终让用户构建）电路。下面是应用程序应该是什么样子的粗略草图。

底部面板（现为简单QToolBar）应该是恒定的高度，但跨越应用和侧板（IOPanel S IN的下面的代码）的宽度应具有恒定的宽度和跨越应用程序的高度。

应用（Canvas，这也是目前QWidget与重写paintEvent方法，但可能最终成为一个QGraphicsView，或者至少一些滚动一个QGraphicsScene），则应该填充剩余空间的主要部分。

这是我当前的代码：

from PyQt5.QtWidgets import * 
from PyQt5.QtCore import Qt, QSize 


class MainWindow(QMainWindow): 
    def __init__(self, *args): 
     super().__init__(*args) 
     self._wire_ys = None 
     self._init_ui() 
     self.update_wire_ys() 

    def update_wire_ys(self): 
     self._wire_ys = [(i + 0.5) * self.panel.height()/4 for i in range(4)] 
     self.input.update_field_positions() 
     self.output.update_field_positions() 

    def wire_ys(self): 
     return self._wire_ys 

    def _init_ui(self): 
     self.panel = QWidget(self) 
     self.canvas = Canvas(self, self.panel) 
     self.input = IOPanel(self, self.panel) 
     self.output = IOPanel(self, self.panel) 

     hbox = QHBoxLayout(self.panel) 
     hbox.addWidget(self.canvas, 1, Qt.AlignCenter) 
     hbox.addWidget(self.input, 0, Qt.AlignLeft) 
     hbox.addWidget(self.output, 0, Qt.AlignRight) 

     self.setCentralWidget(self.panel) 
     self.addToolBar(Qt.BottomToolBarArea, self._create_run_panel()) 
     self.reset_placement() 

    def _create_run_panel(self): 
     # some other code to create the toolbar 
     return QToolBar(self) 

    def reset_placement(self): 
     g = QDesktopWidget().availableGeometry() 
     self.resize(0.4 * g.width(), 0.4 * g.height()) 
     self.move(g.center().x() - self.width()/2, g.center().y() - self.height()/2) 

    def resizeEvent(self, *args, **kwargs): 
     super().resizeEvent(*args, **kwargs) 
     self.update_wire_ys() 


class IOPanel(QWidget): 
    def __init__(self, main_window, *args): 
     super().__init__(*args) 
     self.main = main_window 
     self.io = [Field(self) for _ in range(4)] 

    def update_field_positions(self): 
     wire_ys = self.main.wire_ys() 
     for i in range(len(wire_ys)): 
      field = self.io[i] 
      field.move(self.width() - field.width() - 10, wire_ys[i] - field.height()/2) 

    def sizeHint(self): 
     return QSize(40, self.main.height()) 


class Field(QLabel): 
    def __init__(self, *args): 
     super().__init__(*args) 
     self.setAlignment(Qt.AlignCenter) 
     self.setText(str(0)) 
     self.resize(20, 20) 


# This class is actually defined in another module and imported 
class Canvas(QWidget): 
    def __init__(self, main_window, *args): 
     super().__init__(*args) 
     self.main = main_window 

    def paintEvent(self, e): 
     print("ASFD") 
     qp = QPainter() 
     qp.begin(self) 
     self._draw(qp) 
     qp.end() 

    def _draw(self, qp): 
     # Draw stuff 
     qp.drawLine(0, 0, 1, 1) 


# __main__.py 
def main(): 
    import sys 
    app = QApplication(sys.argv) 
    w = MainWindow() 
    w.show() 
    sys.exit(app.exec_()) 


if __name__ == '__main__': 
    main() 

运行的代码给我下面的：

在这里，我有彩色的组件，以更好地看到他们使用这样的代码在自己建设：

p = self.palette() 
p.setColor(self.backgroundRole(), Qt.blue) 
self.setPalette(p) 
self.setAutoFillBackground(True) 

绿色是中央面板（MainWindow.panel），蓝色是IOPanel s，Field s应该是红色的，而Canvas应该是白色的。

忽略底部的工具栏，它是我上面没有包括的一些额外代码（尽可能保持最小和相关），但它没有调整任何尺寸，也没有布局管理，除了它自己的子代码QWidget。事实上，包括我上面最小例子中的绘画代码给出了与没有运行按钮的较薄的底部工具栏类似的结果。我只是在这里包括工具栏，以显示其在总体布局中的预期行为（因为工具栏工作正常）。

这个结果有几个问题。

问题1

的Field■不要露面，最初。 但是，一旦我调整了主窗口的大小，它们确实出现（并且适当地放置在它们各自的面板内）。为什么是这样？主窗口resizeEvent所做的唯一的事情是update_wire_ys和update_field_positions，并且这些也是由主窗口的__init__执行的。

问题2

的IOPanel s的不正确对齐。第一个应该在中央面板的左侧。更改将他们修复了这个顺序，像这样：

hbox.addWidget(self.input, 0, Qt.AlignLeft) 
hbox.addWidget(self.canvas, 1, Qt.AlignCenter) 
hbox.addWidget(self.output, 0, Qt.AlignRight) 

但是，不应该Qt.AlignX已经做到这一点，无论他们是在添加的顺序吗？如果我以后想要在左侧添加另一个面板，我将不得不移除所有组件，添加新面板然后重新添加它们？

问题3

的IOPanel s的不正确的尺寸。他们需要跨越中央面板的整个高度并触摸中央面板的左侧/右侧边缘。我不确定这是否是布局或面板着色的问题。我究竟做错了什么？

问题4

的Canvas完全不露面，事实上它paintEvent不会被调用（“ASFD”永远不会被打印到控制台）。我并未覆盖其sizeHint，因为我希望中央面板的布局能够自行适当调整Canvas的大小。我希望添加组件时的伸展系数为1可以实现这一点。

hbox.addWidget(self.canvas, 1, Qt.AlignCenter) 

如何让画布实际显示并填充中央面板上的所有剩余空间？

Answer 1

这是典型的意大利面代码，其中很多元素都是纠结的，这通常很难测试，我发现很多问题，例如sizeEvent仅在调用包含窗口小部件的布局时调用，另一个示例是当您使用处理每个其他对象的功能update_field_positions和update_wire_ys。

在这个答案，我将提出一个简单的实现：

• IOPanel CLAS必须包含一个QVBoxLayout，处理图像大小的变化。

• 在MainWindow类中，我们将使用具有对齐的布局，但必须按顺序添加它们。

  lay.addWidget(self.input, 0, Qt.AlignLeft) 
  lay.addWidget(self.canvas, 0, Qt.AlignCenter) 
  lay.addWidget(self.output, 0, Qt.AlignRight) 
  

• 要放置的最小宽度为IOPanel我们使用QSizePolicy()和setMinimumSize()

完整代码：

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

class Field(QLabel): 
    def __init__(self, text="0", parent=None): 
     super(Field, self).__init__(parent=parent) 
     self.setAlignment(Qt.AlignCenter) 
     self.setText(text) 


class IOPanel(QWidget): 
    numbers_of_fields = 4 
    def __init__(self, parent=None): 
     super(IOPanel, self).__init__(parent=None) 
     lay = QVBoxLayout(self) 
     for _ in range(self.numbers_of_fields): 
      w = Field() 
      lay.addWidget(w) 

     self.setMinimumSize(QSize(40, 0)) 
     sizePolicy = QSizePolicy(QSizePolicy.Minimum, QSizePolicy.Preferred) 
     self.setSizePolicy(sizePolicy) 



class Panel(QWidget): 
    def __init__(self, parent=None): 
     super(Panel, self).__init__(parent=None) 
     lay = QHBoxLayout(self) 
     self.input = IOPanel() 
     self.output = IOPanel() 
     self.canvas = QWidget() 

     lay.addWidget(self.input, 0, Qt.AlignLeft) 
     lay.addWidget(self.canvas, 0, Qt.AlignCenter) 
     lay.addWidget(self.output, 0, Qt.AlignRight) 


class MainWindow(QMainWindow): 
    def __init__(self, parent=None): 
     super(MainWindow, self).__init__(parent=parent) 
     self.initUi() 
     self.reset_placement() 

    def initUi(self): 
     panel = Panel(self) 
     self.setCentralWidget(panel) 
     self.addToolBar(Qt.BottomToolBarArea, QToolBar(self)) 

    def reset_placement(self): 
     g = QDesktopWidget().availableGeometry() 
     self.resize(0.4 * g.width(), 0.4 * g.height()) 
     self.move(g.center().x() - self.width()/2, g.center().y() - self.height()/2) 


def main(): 
    import sys 
    app = QApplication(sys.argv) 
    w = MainWindow() 
    w.show() 
    sys.exit(app.exec_()) 


if __name__ == '__main__': 
    main() 

截图：