Load whole *ui file in an frame/widget of another *.ui file

Question

I am developing a small user interface for a home-project. I created a *.ui file with QT-Designer. This is my main window with some navigations buttons, labels and so on. Now I am struggeling to load another *.ui (for example with content) in the frame or widget of the main window when I click on navgation buttons. I am using pyqt4 and I have to implement it with python on an raspberry pi.

I also used the search but I did not find an working solution for my problem. Maybe it is really easy but for me it is difficultly.

*Important: I don't want to reorganize buttons and labels! I want to load a whole *.ui file in a widget or frame which is in the main window!

Here my code examples: The following is my main.py

from PyQt4.QtCore import *
from PyQt4.QtGui import *
from PyQt4.uic import *

def buttonKlick1close():
start.close()

start = loadUi("start.ui")
start.connect(start.pushButton, SIGNAL("clicked()") , buttonKlick1close)

# there are other "signal-connections" for my navigation buttons but I 
# integreated all exactly the same like above. 
# actually when I click to another navigation button it will open an "def" 
# with "window2.showFullscreen()" and so on.... 

start.showFullScreen()
app.exit(app.exec_())

Now, when I click on my navagtion buttons it will always open 7-8 windows and so I also need my whole navgation buttons on every window. My aim is to create ONE window with my navigation buttons and an frame/widget in it where I can promote/load the other *ui files. Or is there another good solution without frames/widgets?

Answer 1

First of all, the basis of my solution is the promotion of a widget, for this I will structure the project in the following way:

├── main.py
├── pages
│   ├── energypage.py
│   ├── fanpage.py
│   ├── homepage.py
│   └── statuspage.py
└── ui
    ├── energy.ui
    ├── fan.ui
    ├── home.ui
    ├── main.ui
    └── status.ui

the .ui of the pages will be based on the Widget template but the main one will use the MainWindow template (MainWindow allows to have ToolBars, StatusBar, DockWidgets, menuBar, etc so I choose it as main).

Since the .ui can not be promoted by itself will create classes that invoke the design and follow a similar structure but you can add more functionalities, for example in the case of homepage.py:

import os
from PyQt4 import QtGui, uic


current_dir = os.path.dirname(os.path.abspath(__file__))
Form, Base = uic.loadUiType(os.path.join(current_dir, "../ui/home.ui"))


class HomeWidget(Base, Form):
    def __init__(self, parent=None):
        super(self.__class__, self).__init__(parent)
        self.setupUi(self)


if __name__ == '__main__':
    import sys
    app = QtGui.QApplication(sys.argv)
    w = HomeWidget()
    w.show()
    sys.exit(app.exec_())

The main.ui has the buttons on the left side and the QStackedWidget on the right side:

Each page was added by selecting the option insert page-> after current page of the menu that opens by right clicking on the QStackedWidget

Then it will be promoted to use the widget that is in the pages folder:

Then in the main you associate the buttons with the appropriate indexes:

main.py

import os
from PyQt4 import QtGui, uic
from functools import partial

current_dir = os.path.dirname(os.path.abspath(__file__))
Form, Base = uic.loadUiType(os.path.join(current_dir, "ui/main.ui"))

class MainWidget(Base, Form):
    def __init__(self, parent=None):
        super(self.__class__, self).__init__(parent)
        self.setupUi(self)
        buttons = (self.homebutton, self.statusbutton, self.fanbutton, self.energybutton)
        for i, button in enumerate(buttons):
            button.clicked.connect(partial(self.stackedWidget.setCurrentIndex, i))

if __name__ == '__main__':
    import sys
    app = QtGui.QApplication(sys.argv)
    app.setStyle("fusion")
    w = MainWidget()
    w.show()
    sys.exit(app.exec_())

The complete example is here.