PyQt实现响应式布局的一种方式

一、尝试过的方法

1. 使用QGridLayout等布局，写死跨行跨列的数字，只是在视觉上间接实现，而且效果不佳；

2. 使用resizeEvent()和repaint()等重载函数，硬编码每当窗口发生resizeEvent时各个Widget的大小与行为，工作量巨大；

二、再次改进的方法

改用各个Widget的SizePolicy规定X、Y轴的是否伸缩，甚至规定它们的伸缩因子，实现类似于响应式布局中的固定左侧菜单栏(无论窗口怎么改变大小，它都会保持适合自己的最佳尺寸，猜测很可能是Qt对Widget的preferred相关的建议尺寸)、固定或者可伸缩右侧操作区域，同时有一个中间的可以上下左右扩展的类似文本编辑区域。同时需要注意，如果不是自己扩展的Widget,使用Qt自带的Widget直接加入到Layout会导致该Widget随着布局的特性而移动(比如居中时会跑到区域中间)，这种情况最好自己写一个Widget,并且使它在加入主Layout的时候是能够占满空间的，避免像原生控件一样只占最小空间。另外SizePolicy和Layout间有些特性可能会被互相覆盖，这些特性就没有在这个例子体现了。运行截图和主要代码分别如下：

import sys
from PyQt5.QtCore import Qt
from PyQt5.QtWidgets import QApplication, QWidget, QLabel, QHBoxLayout, QVBoxLayout, QSizePolicy

app = QApplication(sys.argv)
window = QWidget()

class MenuBar(QWidget):
    def __init__(self):
        super().__init__()
        self.lay = QVBoxLayout()
        self.lay.setAlignment(Qt.AlignTop)
        self.setLayout(self.lay)
        self.l0 = QLabel("固定菜单栏项目1")
        self.l0.setSizePolicy(QSizePolicy.Fixed, QSizePolicy.Fixed)
        self.lay.addWidget(self.l0)

class MainWindow(QWidget):
    def __init__(self):
        super().__init__()
        self.initUI()

    def initUI(self):
        self.lay = QHBoxLayout()
        self.comp = []
        
        self.comp.append(MenuBar())
        self.comp[0].setSizePolicy(QSizePolicy.Fixed, QSizePolicy.Expanding)

        self.comp.append(QLabel("响应式编辑区"))
        self.comp[1].setStyleSheet("background-color: red;")
        po1 = QSizePolicy(QSizePolicy.Expanding, QSizePolicy.Expanding)
        po1.setHorizontalStretch(3)
        self.comp[1].setSizePolicy(po1)

        self.comp.append(QLabel("固定操作区"))
        po2 = QSizePolicy(QSizePolicy.Expanding, QSizePolicy.Fixed)
        po2.setHorizontalStretch(1)
        self.comp[2].setSizePolicy(po2)

        for widget in self.comp:
            self.lay.addWidget(widget)
        self.setGeometry(400, 400, 600, 600)
        self.setLayout(self.lay)


w = MainWindow()
w.show()

app.exec()