PyQt5 在qtdesigner中使用自定义的控件

前言

奇奇怪怪!,虽然和我想象不一样但是还是记录一下吧！本来我以为是在QDesigner左边能显示控件可以实时拖拽，但是谁知道实际是在.ui文件中相当于一个占位符一样理解! 转化为.py文件加载了自定义的控件类（就是类似占位替换的感觉），果然python 用QDesigner太鸡肋，有这个时间拖来拖去，代码码UI都完了！！！

1 提升控件

打开QDesigner，创建一个QWidget，在上面拖2个QFrame,给QWidget创建一个水平布局，如下：

选择一个frame右击提升窗口部件，最后点击提升，如下：

提升为自定义类：


其中BoardFrame为自定义的一个控件，BoardFrame继承于QFrame.
BoardFrame.py代码如下：

#!/usr/bin/env python
# -*- coding:utf-8 -*-
from PyQt5.QtWidgets import *
from PyQt5.QtCore import pyqtSignal,Qt,QRegExp
from PyQt5.QtGui import QRegExpValidator
import sys

class BoardFrame(QFrame):
    def __init__(self, *argc, **argv):
        super(BoardFrame, self).__init__(*argc, **argv)
        self.setFixedSize(200,500)
        self.mainlayout = QVBoxLayout(self)
        self.name = QLabel("名字")
        self.name.setFrameStyle(QFrame.Box | QFrame.Plain)
        self.name.setAlignment(Qt.AlignCenter)
        self.mainlayout.addWidget(self.name )
        self.frame = QFrame(self)
        self.mainlayout.addWidget(self.frame)
        frame_layout = QVBoxLayout(self.frame)
        for i in range(16):
            btn = QCheckBox("按钮%d " % (i))
            frame_layout.addWidget(btn)
            frame_layout.setContentsMargins(4,4,4,4)
            if (i + 1) % 8 == 0:
                frame01 = QFrame(self.frame)
                frame01.setFrameStyle(QFrame.HLine | QFrame.Plain)
                frame_layout.addWidget(frame01)
        #
        childlayout = QHBoxLayout()
        clear_btn = QPushButton("全部取消")
        set_btn = QPushButton("全部勾选")
        childlayout.addWidget(clear_btn)
        childlayout.addWidget(set_btn)
        self.mainlayout.addLayout(childlayout)
        ##边框
        self.frame.setFrameStyle(QFrame.Box | QFrame.Plain)
        
if __name__ == '__main__':
    app = QApplication(sys.argv)
    win = BoardFrame()
    win.show()
    sys.exit(app.exec_())

2 转化.ui文件为.py文件

保存ui文件为test.ui,然后转化为.py文件 pyuic5 -o test.py test.ui
将BoardFrame.py 和 test.py文件放到同级目录。

# -*- coding: utf-8 -*-

# Form implementation generated from reading ui file 'test.ui'
#
# Created by: PyQt5 UI code generator 5.15.2
#
# WARNING: Any manual changes made to this file will be lost when pyuic5 is
# run again.  Do not edit this file unless you know what you are doing.


from PyQt5 import QtCore, QtGui, QtWidgets
from BoardFrame import BoardFrame


class Ui_Form(object):
    def setupUi(self, Form):
        Form.setObjectName("Form")
        Form.resize(400, 600)
        self.horizontalLayout = QtWidgets.QHBoxLayout(Form)
        self.horizontalLayout.setObjectName("horizontalLayout")
        self.frame = BoardFrame(Form)
        self.frame.setFrameShape(QtWidgets.QFrame.StyledPanel)
        self.frame.setFrameShadow(QtWidgets.QFrame.Raised)
        self.frame.setObjectName("frame")
        self.horizontalLayout.addWidget(self.frame)
        self.frame_2 = BoardFrame(Form)
        self.frame_2.setFrameShape(QtWidgets.QFrame.StyledPanel)
        self.frame_2.setFrameShadow(QtWidgets.QFrame.Raised)
        self.frame_2.setObjectName("frame_2")
        self.horizontalLayout.addWidget(self.frame_2)

        self.retranslateUi(Form)
        QtCore.QMetaObject.connectSlotsByName(Form)

    def retranslateUi(self, Form):
        _translate = QtCore.QCoreApplication.translate
        Form.setWindowTitle(_translate("Form", "Form"))

#上面为工具转化的代码，下面为我们自己添加的测试
if __name__ == '__main__':
    import sys
    app = QtWidgets.QApplication(sys.argv)
    widget = QtWidgets.QWidget()
    #widget.setStyleSheet("background-color:red;")
    widget.show()
    test = Ui_Form()
    test.setupUi(widget)
    sys.exit(app.exec_())

效果如下：