Search code examples
qtpyqtpysideqt-designerpyside6

How to create collapsible group of lables and combo box in QT designer


I have group of label and combo box which I need to group. By toggling group name i should able to see the widgets. I have found only checkable in group box widget which is disabling the widgets instead collapsible. How can we achieve this in QT designers.

I want to achive like below in QT designer. Please show some light on this

enter image description here


Solution

  • This can theoretically be done in Designer, but with the following limitations:

    • the widgets should be put in a single container (like a QWidget) that must not be the same as the checkbox;
    • alternatively, the connection (see below) should be done individually for each widget;
    • widgets cannot be directly hidden in Designer, so if they have to be hidden by default, that must be done by code;
    • toggling widgets visibility will alter the layout, which might not be ideal; the alternative is to use setRetainSizeWhenHidden() on their size policy, which can only be done by code;
    • the checkbox does not use an icon, so you need to set a proper stylesheet for it if you want to display an arrow;

    The procedure is the following:

    1. add a QCheckBox to the layout;
    2. add a QWidget as a container at its bottom;
    3. add at least one widget to that container, then set a layout for it;
    4. add the other widgets;
    5. enter in the "Signal/Slot" mode (F4 or from the "Edit" menu)
    6. press the mouse button on the checkbox, move the mouse to the container (not the widgets!) and release the mouse button;
    7. a dialog will open, check the "Show signals and slots inherited from QWidget";
    8. select the toggled(bool) signal on the left;
    9. select the setVisible(bool) slot on the right;
    10. click "Ok" to close the dialog;

    Note about point 3: adding a layout to a container always requires to add a child widget (Designer doesn't allow to create layouts for empty widgets). In case the container becomes too small to add child widgets before the layout is set, you can temporarily set its minimum height (and/or width, depending on the orientation) in the property box, then remember to reset that property once the layout has been set.

    Remember that, in general, aspects like these are normally implemented by code for better control over their behavior.