Search code examples
pythonpyqtpysideqt-designer

Inserting a tab into QTabWidget from a pre-defined layout


I am trying to add tabs to my QTabWidget dynamically and the simple thing I want to do is duplicate the 1st preset tab that I already have. Now before you lead me to this question: Button for duplicating tabs in a QTabWidget, hear me out.

I don't want to manually duplicate the tab. The tab that I have is detailed and can have major updates made to it at any time, I would like to simply edit it in the QTDesigner and then perhaps duplicate it dynamically or simply insert the given form into the QTabWidget. I've tried many things (i.e.: Trying to make a separate form and importing it, designing my own tab page class [which worked but it's not what I'm looking for], literally copying the tabWidget and trying to add it) but none of them seem to do the trick.

I just need a tab to be inserted via a pre-defined UI.

EDIT:

After creating a form via the QtDesigner software and exporting it into a python file I get this code:

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

# Form implementation generated from reading ui file 'newTab.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


class Ui_Form(object):
    def setupUi(self, Form):
        Form.setObjectName("Form")
        Form.resize(810, 672)
        self.verticalLayout = QtWidgets.QVBoxLayout(Form)
        self.verticalLayout.setObjectName("verticalLayout")
        self.testIdFrame = QtWidgets.QFrame(Form)
        self.testIdFrame.setMinimumSize(QtCore.QSize(0, 622))
        font = QtGui.QFont()
        font.setFamily("Segoe UI Black")
        font.setBold(True)
        font.setItalic(True)
        font.setUnderline(False)
        font.setWeight(75)
        self.testIdFrame.setFont(font)
        self.testIdFrame.setStyleSheet("background: transparent;")
        self.testIdFrame.setFrameShape(QtWidgets.QFrame.StyledPanel)
        self.testIdFrame.setFrameShadow(QtWidgets.QFrame.Raised)
        self.testIdFrame.setObjectName("testIdFrame")
        self.atpDropBox = QtWidgets.QComboBox(self.testIdFrame)
        self.atpDropBox.setGeometry(QtCore.QRect(120, 20, 98, 31))
        self.atpDropBox.setObjectName("atpDropBox")
        self.snLabel = QtWidgets.QLabel(self.testIdFrame)
        self.snLabel.setGeometry(QtCore.QRect(260, 30, 32, 21))
        self.snLabel.setObjectName("snLabel")
        self.workOrderLabel = QtWidgets.QLabel(self.testIdFrame)
        self.workOrderLabel.setGeometry(QtCore.QRect(10, 30, 75, 21))
        self.workOrderLabel.setObjectName("workOrderLabel")
        self.powerSupplyLabel1 = QtWidgets.QLabel(self.testIdFrame)
        self.powerSupplyLabel1.setGeometry(QtCore.QRect(10, 70, 101, 21))
        self.powerSupplyLabel1.setObjectName("powerSupplyLabel1")
        self.snTextEdit = QtWidgets.QTextEdit(self.testIdFrame)
        self.snTextEdit.setGeometry(QtCore.QRect(300, 20, 131, 31))
        self.snTextEdit.setStyleSheet("QTextEdit {\n"
"border: 1px solid black;\n"
"border-radius:5px; \n"
"}")
        self.snTextEdit.setObjectName("snTextEdit")
        self.voltageTextEdit1 = QtWidgets.QTextEdit(self.testIdFrame)
        self.voltageTextEdit1.setGeometry(QtCore.QRect(200, 60, 101, 31))
        self.voltageTextEdit1.setAutoFillBackground(False)
        self.voltageTextEdit1.setStyleSheet("QTextEdit {\n"
"border: 1px solid black;\n"
"border-radius:5px; \n"
"}")
        self.voltageTextEdit1.setObjectName("voltageTextEdit1")
        self.voltageLabel1 = QtWidgets.QLabel(self.testIdFrame)
        self.voltageLabel1.setGeometry(QtCore.QRect(120, 70, 71, 21))
        self.voltageLabel1.setObjectName("voltageLabel1")
        self.voltageLabel2 = QtWidgets.QLabel(self.testIdFrame)
        self.voltageLabel2.setGeometry(QtCore.QRect(120, 110, 71, 21))
        self.voltageLabel2.setObjectName("voltageLabel2")
        self.voltageTextEdit2 = QtWidgets.QTextEdit(self.testIdFrame)
        self.voltageTextEdit2.setGeometry(QtCore.QRect(200, 100, 101, 31))
        self.voltageTextEdit2.setAutoFillBackground(False)
        self.voltageTextEdit2.setStyleSheet("QTextEdit {\n"
"border: 1px solid black;\n"
"border-radius:5px; \n"
"}")
        self.voltageTextEdit2.setObjectName("voltageTextEdit2")
        self.powerSupplyLabel2 = QtWidgets.QLabel(self.testIdFrame)
        self.powerSupplyLabel2.setGeometry(QtCore.QRect(10, 110, 101, 21))
        self.powerSupplyLabel2.setObjectName("powerSupplyLabel2")
        self.currentLabel2 = QtWidgets.QLabel(self.testIdFrame)
        self.currentLabel2.setGeometry(QtCore.QRect(310, 110, 81, 21))
        self.currentLabel2.setObjectName("currentLabel2")
        self.currentLabel1 = QtWidgets.QLabel(self.testIdFrame)
        self.currentLabel1.setGeometry(QtCore.QRect(310, 70, 91, 21))
        self.currentLabel1.setObjectName("currentLabel1")
        self.currentTextEdit1 = QtWidgets.QTextEdit(self.testIdFrame)
        self.currentTextEdit1.setGeometry(QtCore.QRect(400, 60, 101, 31))
        self.currentTextEdit1.setAutoFillBackground(False)
        self.currentTextEdit1.setStyleSheet("QTextEdit {\n"
"border: 1px solid black;\n"
"border-radius:5px; \n"
"}")
        self.currentTextEdit1.setObjectName("currentTextEdit1")
        self.currentTextEdit2 = QtWidgets.QTextEdit(self.testIdFrame)
        self.currentTextEdit2.setGeometry(QtCore.QRect(400, 100, 101, 31))
        self.currentTextEdit2.setAutoFillBackground(False)
        self.currentTextEdit2.setStyleSheet("QTextEdit {\n"
"border: 1px solid black;\n"
"border-radius:5px; \n"
"}")
        self.currentTextEdit2.setObjectName("currentTextEdit2")
        self.verticalLayout.addWidget(self.testIdFrame)
        self.RXFrame = QtWidgets.QFrame(Form)
        self.RXFrame.setStyleSheet("background: transparent;")
        self.RXFrame.setFrameShape(QtWidgets.QFrame.StyledPanel)
        self.RXFrame.setFrameShadow(QtWidgets.QFrame.Raised)
        self.RXFrame.setObjectName("RXFrame")
        self.verticalLayout.addWidget(self.RXFrame)
        self.TXFrame = QtWidgets.QFrame(Form)
        self.TXFrame.setStyleSheet("background: transparent;")
        self.TXFrame.setFrameShape(QtWidgets.QFrame.StyledPanel)
        self.TXFrame.setFrameShadow(QtWidgets.QFrame.Raised)
        self.TXFrame.setObjectName("TXFrame")
        self.verticalLayout.addWidget(self.TXFrame)

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

    def retranslateUi(self, Form):
        _translate = QtCore.QCoreApplication.translate
        Form.setWindowTitle(_translate("Form", "Form"))
        self.snLabel.setText(_translate("Form", "SN:"))
        self.workOrderLabel.setText(_translate("Form", "Work Order:"))
        self.powerSupplyLabel1.setText(_translate("Form", "Power Supply 1:"))
        self.voltageLabel1.setText(_translate("Form", "Voltage [V]:"))
        self.voltageLabel2.setText(_translate("Form", "Voltage [V]:"))
        self.powerSupplyLabel2.setText(_translate("Form", "Power Supply 2:"))
        self.currentLabel2.setText(_translate("Form", "Current [mA]:"))
        self.currentLabel1.setText(_translate("Form", "Current [mA]:"))


if __name__ == "__main__":
    import sys
    app = QtWidgets.QApplication(sys.argv)
    Form = QtWidgets.QWidget()
    ui = Ui_Form()
    ui.setupUi(Form)
    Form.show()
    sys.exit(app.exec_())

In my MainWindow class I import the Ui_Form from the newly generated python file which contains the contents of the new tab that I would like to duplicate. This is where I get stuck.. I call the function that will build my tabs for me:

def buildTabs(self, numberOfTabs): 
    for dut in range(numberOfTabs): 
        text = ('TAB ' + ascii_uppercase[dut]) 
        self.ui.tabWidget.addTab(Ui_Form(), text)

The tab widget is in the ui of the main window.

I don't understand how I can turn the Ui_Form() into a Ui_TabPage or a QWidget like shown in this question

QT Designer Form:

enter image description here


Solution

  • Files generated by pyuic are form classes, they are actually standard python object classes, and they need a QWidget instance (or whatever class used in Designer for that ui, such as a QDialog) to "build" them.

    def buildTabs(self, numberOfTabs): 
        for dut in range(numberOfTabs): 
            page = QtWidgets.QWidget()
            page.ui = Ui_Form()
            page.ui.setupUi(page)        
            text = ('TAB ' + ascii_uppercase[dut])
            self.ui.tabWidget.addTab(page, text)
    

    Consider that PyQt and PySide cannot be mixed, so if you're using PyQt the command is pyuic, while with PySide the command is pyside2-uic.

    Note that if you need further interaction with the tab pages, it's usually better to subclass them:

    class PageOne(QtWidgets.QWidget):
        def __init__(self, parent=None):
            super().__init__(parent)
            self.ui = Ui_Form()
            self.ui.setupUi(self)
    
            self.ui.someButton.clicked.connect(self.someFunction)
            # ...
    

    Or better, with the multiple inheritance method, which avoids to constantly access ui elements through the ui "sub-object":

    class PageOne(QtWidgets.QWidget, Ui_Form):
        def __init__(self, parent=None):
            super().__init__(parent)
            self.setupUi(self)
    
            self.someButton.clicked.connect(self.someFunction)
            # ...
    

    And then:

    def buildTabs(self, numberOfTabs): 
        for dut in range(numberOfTabs): 
            page = PageOne()
            text = ('TAB ' + ascii_uppercase[dut])
            self.ui.tabWidget.addTab(page, text)