如何将 QHBoxLayout 中的 2 个 QVBoxLayout 与每个 50% 的区域对齐以及如何对齐 combo_test11 和 txt_test22 以便它们看起来正确

Question

从图 2 中可以看出，QVBoxLayout 看起来很糟糕，那么我们如何设计才能使两者各占 QHBoxLayout 大小的 50%。

如您所见，combo_test11(QComboBox) 和 txt_test22(QLineEdit) 看起来都没有正确对齐。两个小部件应该是相同的 stacked/aligned 那么我们如何设计它。

我不能添加任何固定宽度，因为我需要整个框和小部件响应，所以任何固定宽度的解决方案都是不可接受的

下面是我的实现：

from PySide2.QtCore import Qt
from PySide2 import QtWidgets, QtCore, QtGui
from PySide2.QtGui import QStandardItemModel
from PySide2.QtWidgets import QHBoxLayout, QVBoxLayout, QAbstractItemView, QDesktopWidget, QPushButton


class WizardTkFrame(QtWidgets.QMainWindow):
    def __init__(self):
        super().__init__()
        self.init_window()

    def init_window(self):

        self.widget = QtWidgets.QWidget()
        self.scroll = QtWidgets.QScrollArea()

        v1_layout = QtWidgets.QVBoxLayout(self)
        v2_layout = QtWidgets.QVBoxLayout(self)

        self.label_test1 = QtWidgets.QLabel()
        self.label_test1.setText('Test1<font color=\"red\"> *</font>')
        self.combo_test1 = QtWidgets.QComboBox(self)
        v1_layout.addLayout(self.horiz_layout([self.label_test1, self.combo_test1]))

        self.label_test11 = QtWidgets.QLabel()
        self.label_test11.setText('Test1 value<font color=\"red\"> *</font>')
        self.combo_test11 = QtWidgets.QComboBox(self)
        v2_layout.addLayout(self.horiz_layout([self.label_test11, self.combo_test11]))

        self.label_test2 = QtWidgets.QLabel("Test2 By")
        self.combo_test2 = QtWidgets.QComboBox(self)
        v1_layout.addLayout(self.horiz_layout([self.label_test2, self.combo_test2]))

        self.label_test22 = QtWidgets.QLabel()
        self.label_test22.setText('Test2 Value<font color=\"red\"> *</font>')
        self.txt_test22 = QtWidgets.QLineEdit(self)
        v2_layout.addLayout(self.horiz_layout([self.label_test22, self.txt_test22]))

        layout = QtWidgets.QHBoxLayout(self)
        layout.addLayout(v1_layout)
        layout.addLayout(v2_layout)
        self.widget.setLayout(layout)

        self.scroll.setVerticalScrollBarPolicy(QtCore.Qt.ScrollBarAsNeeded)
        self.scroll.setHorizontalScrollBarPolicy(QtCore.Qt.ScrollBarAsNeeded)
        self.scroll.setWidgetResizable(True)
        self.scroll.setWidget(self.widget)
        self.setCentralWidget(self.scroll)

    def horiz_layout(self, controls: list, type="widget"):
        temp_obj = QHBoxLayout()
        for x in controls:
            if type == "widget":
                temp_obj.addWidget(x)
            elif type == "layout":
                temp_obj.addLayout(x)
        return temp_obj


def center(widget):
    qRect = widget.frameGeometry()
    centerPoint = QDesktopWidget().availableGeometry().center()
    qRect.moveCenter(centerPoint)
    widget.move(qRect.topLeft())


if __name__ == "__main__":
    app = QtWidgets.QApplication([])
    widget = WizardTkFrame()
    widget.setGeometry(200, 100, 600, 500)
    widget.setWindowTitle("Test")
    center(widget)
    widget.show()
    app.exec_()

Answer 1

无论您是在设计器中（推荐）还是在代码中执行此操作，您都可能想要使用拉伸参数。为了使这种特殊形式看起来不错，label:control 的 1:2 比率也不错。

此外，您可能希望标签文本右对齐。您可以在 HTML 标记或对齐属性.

中执行此操作

我修改了你的 horiz_layout 函数来拉伸：

def horiz_layout(self, controls: list, type="widget"):
    temp_obj = QHBoxLayout()
    for x in controls:
        if type == "widget":
            temp_obj.addWidget(x)
        elif type == "layout":
            temp_obj.addLayout(x)
    temp_obj.setStretch(0,1)  # 0th col stretch is 1
    temp_obj.setStretch(1,2)  # 1th col stretch is 2
    return temp_obj

我用 <div align=right> 和 </div> 封装了你所有的标签文本。这是我得到的：

如何将 QHBoxLayout 中的 2 个 QVBoxLayout 与每个 50% 的区域对齐以及如何对齐 combo_test11 和 txt_test22 以便它们看起来正确

How to align 2 QVBoxLayout in QHBoxLayout with 50% area each and how to align combo_test11 and txt_test22 so that they look proper in line

python

pyside2