QGroupBox 中的 QButton 布局，用于在 PyQt5 中制作 UI

Question

我将 QButtons 排列为第一行有四个按钮，第二行有五个按钮。 我的代码是在 Python2.7 中使用 PyQt5 开发的。

from PyQt5 import QtCore, QtGui, QtWidgets
import cv2
import time
import face_recognition.api as face_recognition

class Thread(QtCore.QThread):
    changePixmap = QtCore.pyqtSignal(QtGui.QImage)
    scaled_size = QtCore.QSize(640, 480)

    def run(self):
        cap = cv2.VideoCapture(1)
        cap.set(3,1280);
        cap.set(4,1024);
        time.sleep(2)
        while True:
            ret, frame = cap.read()                  
            if ret:
                r=1
                face_locations=[]
                rescaleSize=480
                if(frame.shape[0] > 480 and frame.shape[1] > 640):
                    r = rescaleSize / float(frame.shape[0])
                    dim = (int(frame.shape[1] * r), rescaleSize)
                    face_locations = face_recognition.face_locations(cv2.resize(frame, dim, fx=0.0, fy=0.0))
                else:
                    face_locations = face_recognition.face_locations(frame)
                for face_location in face_locations:  
                    top, right, bottom, left = face_location
                    cv2.rectangle(frame,(int(right/r),int(top/r)),(int(left/r),int(bottom/r)),(0,255,0),2)
                rgbImage = cv2.cvtColor(frame, cv2.COLOR_BGR2RGB)
                convertToQtFormat = QtGui.QImage(rgbImage.data, rgbImage.shape[1], rgbImage.shape[0], QtGui.QImage.Format_RGB888)
                p = convertToQtFormat.scaled(self.scaled_size, QtCore.Qt.KeepAspectRatio)
                self.changePixmap.emit(p)

    def scaled(self, scaled_size):
        self.scaled_size = scaled_size


class PlayStreaming(QtWidgets.QLabel):
    reSize = QtCore.pyqtSignal(QtCore.QSize)
    def __init__(self):
        super(PlayStreaming, self).__init__()
        self.initUI()

    @QtCore.pyqtSlot(QtGui.QImage)
    def setImage(self, image):
        self.label.setPixmap(QtGui.QPixmap.fromImage(image))

    def initUI(self):
        self.setWindowTitle("Image")
        # create a label
        self.label = QtWidgets.QLabel(self)
        th = Thread(self)
        th.changePixmap.connect(self.setImage)
        self.reSize.connect(th.scaled)
        th.start()
        lay = QtWidgets.QVBoxLayout(self)
        lay.addWidget(self.label, alignment=QtCore.Qt.AlignCenter)

    def resizeEvent(self, event):
        self.reSize.emit(self.size())


class UIWidget(QtWidgets.QWidget):
    def __init__(self, parent=None):
        super(UIWidget, self).__init__(parent)
        # Initialize tab screen
        self.tabs = QtWidgets.QTabWidget()
        self.tab1 = QtWidgets.QWidget()
        self.tab2 = QtWidgets.QWidget()
        self.tab3 = QtWidgets.QWidget()

        # Add tabs
        self.tabs.addTab(self.tab1, "Face")
        self.tabs.addTab(self.tab2, "Human")
        self.tabs.addTab(self.tab3, "Vehicle")

        # Create first tab
        self.createGridLayout()
        self.tab1.layout = QtWidgets.QVBoxLayout()
        self.display = PlayStreaming()
        self.tab1.layout.addWidget(self.display, stretch=1)
        self.tab1.layout.addWidget(self.horizontalGroupBox)
        self.tab1.setLayout(self.tab1.layout)

        # Add tabs to widget
        layout = QtWidgets.QVBoxLayout(self)
        layout.addWidget(self.tabs)

    def createGridLayout(self):
        self.horizontalGroupBox = QtWidgets.QGroupBox("")
        self.horizontalGroupBox.setStyleSheet("QGroupBox{ background-color: red; border: none;}")  
        layout = QtWidgets.QGridLayout()
        layout.addWidget(QtWidgets.QPushButton('Test'),0,0) 
        layout.addWidget(QtWidgets.QPushButton('Run'),0,1) 
        layout.addWidget(QtWidgets.QPushButton('RescaleUp'),0,2) 
        layout.addWidget(QtWidgets.QPushButton('RescaleDown'),0,3) 
        layout.addWidget(QtWidgets.QPushButton('Set Faces'),1,0) 
        layout.addWidget(QtWidgets.QPushButton('FacePose'),1,1)
        layout.addWidget(QtWidgets.QPushButton('Gender'),1,2) 
        layout.addWidget(QtWidgets.QPushButton('Age'),1,3)
        layout.addWidget(QtWidgets.QPushButton('Recognize'),1,4)
        self.horizontalGroupBox.setLayout(layout)



if __name__ == '__main__':
    import sys

    app = QtWidgets.QApplication(sys.argv)
    w = UIWidget()
    w.resize(1000, 800)
    w.show()
    sys.exit(app.exec_())

我喜欢让前四个按钮等距，第二个按钮也等距。 为此，更改为

class UIWidget(QtWidgets.QWidget):
    def __init__(self, parent=None):
        super(UIWidget, self).__init__(parent)
        # Initialize tab screen
        self.tabs = QtWidgets.QTabWidget()
        self.tab1 = QtWidgets.QWidget()
        self.tab2 = QtWidgets.QWidget()
        self.tab3 = QtWidgets.QWidget()

        # Add tabs
        self.tabs.addTab(self.tab1, "Face")
        self.tabs.addTab(self.tab2, "Human")
        self.tabs.addTab(self.tab3, "Vehicle")

        # Create first tab
        self.createGridLayout()
        self.tab1.layout = QtWidgets.QVBoxLayout()
        self.display = PlayStreaming()
        self.tab1.layout.addWidget(self.display, stretch=1)
        self.tab1.layout.addWidget(self.horizontalGroupBox)
        self.tab1.layout.addWidget(self.horizontalGroupBox2)
        self.tab1.setLayout(self.tab1.layout)

        # Add tabs to widget
        layout = QtWidgets.QVBoxLayout(self)
        layout.addWidget(self.tabs)

    def createGridLayout(self):
        self.horizontalGroupBox = QtWidgets.QGroupBox("")
        self.horizontalGroupBox.setStyleSheet("QGroupBox{ background-color: red; border: none;}")  
        layout = QtWidgets.QGridLayout()
        layout.addWidget(QtWidgets.QPushButton('Test'),0,0) 
        layout.addWidget(QtWidgets.QPushButton('Run'),0,1) 
        layout.addWidget(QtWidgets.QPushButton('RescaleUp'),0,2) 
        layout.addWidget(QtWidgets.QPushButton('RescaleDown'),0,3) 
        self.horizontalGroupBox.setLayout(layout)
        self.horizontalGroupBox2 = QtWidgets.QGroupBox("")
        self.horizontalGroupBox2.setStyleSheet("QGroupBox{ background-color: red; border: none;}")  
        layout = QtWidgets.QGridLayout()        
        layout.addWidget(QtWidgets.QPushButton('Set Faces'),0,0) 
        layout.addWidget(QtWidgets.QPushButton('FacePose'),0,1)
        layout.addWidget(QtWidgets.QPushButton('Gender'),0,2) 
        layout.addWidget(QtWidgets.QPushButton('Age'),0,3)
        layout.addWidget(QtWidgets.QPushButton('Recognize'),0,4)
        self.horizontalGroupBox2.setLayout(layout)

那么两个 QGroupBox 之间就有一个间隙。

我怎样才能做到没有间隙，第一行和第二行的按钮间距相等？

Answer 1

您必须在 2 QHBoxLayouts 旁边使用 1 QVBoxLayout：

def createGridLayout(self):
    self.horizontalGroupBox = QtWidgets.QGroupBox("")
    self.horizontalGroupBox.setStyleSheet("QGroupBox{ background-color: red; border: none;}")  

    hlay1 = QtWidgets.QHBoxLayout()
    hlay1.addWidget(QtWidgets.QPushButton('Test')) 
    hlay1.addWidget(QtWidgets.QPushButton('Run')) 
    hlay1.addWidget(QtWidgets.QPushButton('RescaleUp')) 
    hlay1.addWidget(QtWidgets.QPushButton('RescaleDown')) 

    hlay2 = QtWidgets.QHBoxLayout()
    hlay2.addWidget(QtWidgets.QPushButton('Set Faces')) 
    hlay2.addWidget(QtWidgets.QPushButton('FacePose'))
    hlay2.addWidget(QtWidgets.QPushButton('Gender')) 
    hlay2.addWidget(QtWidgets.QPushButton('Age'))
    hlay2.addWidget(QtWidgets.QPushButton('Recognize'))

    layout = QtWidgets.QVBoxLayout()        
    layout.addLayout(hlay1)
    layout.addLayout(hlay2)
    self.horizontalGroupBox.setLayout(layout)