widgets placement in tabs

Question

So I have this code:

from PyQt5.QtWidgets import QMainWindow, QApplication, QPushButton, QWidget, QAction, QTabWidget, QVBoxLayout, QHBoxLayout, QComboBox, QLabel
from PyQt5.QtGui import QIcon
from PyQt5.QtCore import pyqtSlot
from lang import getLang
import sys, os, configparser

config = configparser.ConfigParser()
config.read("Settings.ini")

# Config get setting and change setting
#print(config.get("Main", "language"))
#config.set("Main", "language", "danish")
#with open("Settings.ini", "w") as cfg_file:
    #config.write(cfg_file)

class App(QMainWindow):
    def __init__(self):
        super().__init__()

        # Window Settings
        self.x, self.y, self.w, self.h = 0, 0, 300, 200

        self.setGeometry(self.x, self.y, self.w, self.h)

        self.window = MainWindow(self)
        self.setCentralWidget(self.window)
        self.setWindowTitle("Window title") # Window Title
        self.show()

class MainWindow(QWidget):        
    def __init__(self, parent):   
        super(QWidget, self).__init__(parent)
        layout = QVBoxLayout(self)

        # Run this after settings
        self.lang = getLang(config.get("Main", "language"))

        # Initialize tabs
        tab_holder = QTabWidget()   # Create tab holder
        tab_1 = QWidget()           # Tab one
        tab_2 = QWidget()           # Tab two

        # Add tabs
        tab_holder.addTab(tab_1, self.lang["tab_1_title"]) # Add "tab1" to the tabs holder "tabs"
        tab_holder.addTab(tab_2, self.lang["tab_2_title"]) # Add "tab2" to the tabs holder "tabs" 

        # Create first tab
        tab_1.layout = QVBoxLayout(self)
        tab_2.layout = QVBoxLayout(self)

        # Buttons
        button_start = QPushButton(self.lang["btn_start"])
        button_stop = QPushButton(self.lang["btn_stop"])
        button_test = QPushButton(self.lang["btn_test"])

        # Button Extra
        button_start.setToolTip("This is a tooltip for the button!")    # Message to show when mouse hover
        button_start.clicked.connect(self.on_click)

        button_stop.clicked.connect(self.on_click)

        button_test.clicked.connect(self.on_click)
        #button_start.setEnabled(False)

        # comboBox
        label_language = QLabel("Language")
        combo_language = QComboBox(self)
        combo_language.addItem(self.lang["language_danish"])
        combo_language.addItem(self.lang["language_english"])

        # Move widgets
        combo_language.move(50, 150)
        label_language.move(50, 50)

        # Tab Binding
        self.AddToTab(tab_1, button_start)
        self.AddToTab(tab_1, button_stop)
        self.AddToTab(tab_2, label_language)
        self.AddToTab(tab_2, combo_language)

        # Add tabs to widget        
        tab_1.setLayout(tab_1.layout)
        tab_2.setLayout(tab_2.layout)
        layout.addWidget(tab_holder)
        self.setLayout(layout)

    @pyqtSlot()
    def on_click(self):
        button = self.sender().text()
        if button == self.lang["btn_start"]:
            print("Dank")
        elif button == self.lang["btn_stop"]:
            print("Not dank")

    def AddToTab(self, tab, obj):
        tab.layout.addWidget(obj)

if __name__ == '__main__':
    app = QApplication(sys.argv)
    ex = App()
    sys.exit(app.exec_())

Currently it creates a window that contains 2 buttons on tab one. A "Start" and "Stop" button with no actual function yet other than printing text. On tab 2 I have a label saying "Language:" and a dropdown menu that contains "Danish" and "English".

The problem I have with this, is that it's placement is really really weird and annoying as shown here:

I'm not sure how to change the placement as I can't just use .move on the text label, buttons and dropdown menu since they are placed in tabs.

For example, on tab two I would like the label "Language:" to be right to the left of the dropdown menu.

Answer 1

The problem is caused because you are using QVBoxLayout to set the widgets inside each tab. The task of the layout is to manage the position and size of the widgets so you can not use move(), besides it is not necessary.

The solution is that you create a custom layout for each tab, but keeping an order will create a custom widget for each tab, in the case of the first tab I'll continue using QVBoxlayout but add a stretch so that the widget stays stuck in the top position. In the second case I will combine a QVBoxLayout with a QHBoxLayout, the QHBoxLayout will use it to place the QLabel and the QComboBox and the QVBoxLayout will use it to push the widgets to the top position.

Implementing the above, I have omitted the lang for obvious reasons, we get the following:

from PyQt5 import QtCore, QtGui, QtWidgets
import sys, os, configparser

config = configparser.ConfigParser()
config.read("Settings.ini")

# Config get setting and change setting
#print(config.get("Main", "language"))
#config.set("Main", "language", "danish")
#with open("Settings.ini", "w") as cfg_file:
    #config.write(cfg_file)

class App(QtWidgets.QMainWindow):
    def __init__(self):
        super().__init__()
        # Window Settings
        self.x, self.y, self.w, self.h = 0, 0, 300, 200
        self.setGeometry(self.x, self.y, self.w, self.h)

        self.window = MainWindow(self)
        self.setCentralWidget(self.window)
        self.setWindowTitle("Window title") # Window Title
        self.show()

class GeneralWidget(QtWidgets.QWidget):
    def __init__(self, parent=None):
        super(GeneralWidget, self).__init__(parent)
        lay = QtWidgets.QVBoxLayout(self)
        # Buttons
        button_start = QtWidgets.QPushButton("start") #self.lang["btn_start"])
        button_stop = QtWidgets.QPushButton("stop") #self.lang["btn_stop"])

        # Button Extra
        button_start.setToolTip("This is a tooltip for the button!")    # Message to show when mouse hover
        button_start.clicked.connect(self.on_click)

        button_stop.clicked.connect(self.on_click)

        lay.addWidget(button_start)
        lay.addWidget(button_stop)
        lay.addStretch()

    @QtCore.pyqtSlot()
    def on_click(self):
        button = self.sender().text()
        if button == self.lang["btn_start"]:
            print("Dank")
        elif button == self.lang["btn_stop"]:
            print("Not dank")


class OptionsWidget(QtWidgets.QWidget):
    def __init__(self, parent=None):
        super(OptionsWidget, self).__init__(parent)
        lay = QtWidgets.QVBoxLayout(self)
        hlay = QtWidgets.QHBoxLayout()
        lay.addLayout(hlay)
        lay.addStretch()

        label_language = QtWidgets.QLabel("Language")
        combo_language = QtWidgets.QComboBox(self)
        combo_language.addItem("item1") #self.lang["language_danish"])
        combo_language.addItem("item2") #self.lang["language_english"])
        hlay.addWidget(label_language)
        hlay.addWidget(combo_language)



class MainWindow(QtWidgets.QWidget):        
    def __init__(self, parent):   
        super(MainWindow, self).__init__(parent)
        layout = QtWidgets.QVBoxLayout(self)
        # Run this after settings
        # self.lang = getLang(config.get("Main", "language"))
        # Initialize tabs
        tab_holder = QtWidgets.QTabWidget()   # Create tab holder
        tab_1 = GeneralWidget()           # Tab one
        tab_2 = OptionsWidget()           # Tab two
        # Add tabs
        tab_holder.addTab(tab_1, "General") #self.lang["tab_1_title"]) # Add "tab1" to the tabs holder "tabs"
        tab_holder.addTab(tab_2, "Options") #self.lang["tab_2_title"]) # Add "tab2" to the tabs holder "tabs" 

        layout.addWidget(tab_holder)

if __name__ == '__main__':
    app = QtWidgets.QApplication(sys.argv)
    ex = App()
    sys.exit(app.exec_())