Yoann A.
Yoann A.

Reputation: 423

button overlapping checkbox text

I try to code in PyQt an interface where user can check boxes and then click on the button to process their choices. However, I have some trouble because the button overlaps checkbox labels. Here is a simpler code to show you my problem :

from PyQt5.QtWidgets import QMainWindow, QApplication, QPushButton, QWidget, QTabWidget, QVBoxLayout, QGridLayout, \
    QCheckBox, QHBoxLayout
import sys


class App(QMainWindow):

    def __init__(self):
        super().__init__()
        self.title = 'PyQt5 tabs - pythonspot.com'
        self.left = 0
        self.top = 0
        self.width = 300
        self.height = 200
        self.setWindowTitle(self.title)
        self.setGeometry(self.left, self.top, self.width, self.height)

        self.table_widget = MyTableWidget(self)
        self.setCentralWidget(self.table_widget)

        self.show()


class MyTableWidget(QWidget):

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

        # Initialize tab screen
        self.tabs = QTabWidget()
        self.tab2 = QWidget()
        self.tabs.resize(300, 200)
        self.checkbox_states = {}

        # Add tabs
        self.tabs.addTab(self.tab2, "Tab 2")

        # Create first tab
        self.tab2.layout = QGridLayout()
        checkbox_layout = QVBoxLayout()
        self.checkbox_states["Haar"] = QCheckBox("small")
        self.checkbox_states["db"] = QCheckBox("small")
        self.checkbox_states["sym"] = QCheckBox("small")
        self.checkbox_states["coif"] = QCheckBox("very very very very long")

        for key, l in self.checkbox_states.items():
            l.setChecked(False)
            checkbox_layout.addWidget(l)

        process_button_layout = QHBoxLayout()
        self.process_wavelet = QPushButton("Process")
        process_button_layout.addWidget(self.process_wavelet)
        # QObject.connect(self.process_wavelet, SIGNAL('clicked()'), self._on_process_wavelet)

        self.tab2.layout.addLayout(checkbox_layout, 0, 0, 0, 0)
        self.tab2.layout.addLayout(process_button_layout, 1, 1, 1, 1)
        self.tab2.setLayout(self.tab2.layout)

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


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

Does anyone has an idea on how i can suppress this overlapping problem ? Thanks !

EDIT :

I would like something like this :

enter image description here

Here with a much smaller text, I don't have the overlapping problem. It only appear if we replace the last checkbox's label by a longer string.

Upvotes: 2

Views: 690

Answers (1)

eyllanesc
eyllanesc

Reputation: 244132

What the OP wants can be obtained from many depending on how he wants the geometries of the elements to behave when the window changes in size. So as there are no more restrictions than the image it shows, it will provide a possible solution using QGridLayout where in the first column the QCheckBox will be placed, and in the second column and in the last file the QPushButton:

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

        self.tabs = QTabWidget()
        self.tabs.resize(300, 200)

        layout.addWidget(self.tabs)

        self.tab2 = QWidget()
        self.tabs.addTab(self.tab2, "Tab 2")

        lay = QGridLayout(self.tab2)

        self.checkbox_states = {}
        for i, (key, text) in enumerate(
            (
                ("Haar", "small"),
                ("db", "small"),
                ("sym", "small"),
                ("coif", "very very very very long"),
            )
        ):
            checkbox = QCheckBox(text)
            checkbox.setChecked(False)
            lay.addWidget(checkbox, i, 0)
            self.checkbox_states[key] = checkbox

        self.process_wavelet = QPushButton("Process")
        lay.addWidget(self.process_wavelet, i, 1)

enter image description here

Upvotes: 2

Related Questions