Issue
I'm having an issue where widgets and layouts starts overlapping inside my scroll area. My current layout is supposed to be like this:
My layout:
But ends up like this where the widgets starts overlapping (this is with fixed size group box):
Overlapping example:
Or this (without fixed size group box):
"Sqished" widgets and pushed out of view widgets:
I've tried setting fixed sizes and minimum sizes and changing size policies, but whatever I do some widgets get resized anyways and some get overlapped, and some gets pushed out of view.
I am using designer and PyUIC.
This is my hierarchy if that helps:
Qt designer hierarchy:
The .ui file as generated by designer:
<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
<class>Form</class>
<widget class="QWidget" name="Form">
<property name="geometry">
<rect>
<x>0</x>
<y>0</y>
<width>299</width>
<height>478</height>
</rect>
</property>
<property name="windowTitle">
<string>Form</string>
</property>
<layout class="QGridLayout" name="gridLayout">
<property name="margin">
<number>0</number>
</property>
<item row="0" column="0">
<widget class="QScrollArea" name="scrollArea">
<property name="baseSize">
<size>
<width>0</width>
<height>0</height>
</size>
</property>
<property name="widgetResizable">
<bool>true</bool>
</property>
<widget class="QWidget" name="scrollAreaWidgetContents">
<property name="geometry">
<rect>
<x>0</x>
<y>0</y>
<width>295</width>
<height>474</height>
</rect>
</property>
<property name="minimumSize">
<size>
<width>0</width>
<height>410</height>
</size>
</property>
<layout class="QVBoxLayout" name="verticalLayout_5">
<item>
<layout class="QVBoxLayout" name="verticalLayout">
<property name="spacing">
<number>6</number>
</property>
<property name="sizeConstraint">
<enum>QLayout::SetDefaultConstraint</enum>
</property>
<item>
<widget class="QLabel" name="label_2">
<property name="layoutDirection">
<enum>Qt::LeftToRight</enum>
</property>
<property name="autoFillBackground">
<bool>false</bool>
</property>
<property name="text">
<string>Select a .bed file to open</string>
</property>
</widget>
</item>
<item>
<widget class="BrowseForm" name="browseWidget"/>
</item>
<item>
<widget class="QGroupBox" name="groupBox_2">
<property name="title">
<string>Bead selection mode</string>
</property>
<layout class="QGridLayout" name="gridLayout_2">
<item row="1" column="0">
<widget class="QRadioButton" name="radioStart">
<property name="text">
<string>Start</string>
</property>
<attribute name="buttonGroup">
<string notr="true">beadSelectionModeGroup</string>
</attribute>
</widget>
</item>
<item row="0" column="1">
<widget class="QRadioButton" name="radioInRangeStrict">
<property name="text">
<string>Strictly in range</string>
</property>
<attribute name="buttonGroup">
<string notr="true">beadSelectionModeGroup</string>
</attribute>
</widget>
</item>
<item row="0" column="0">
<widget class="QRadioButton" name="radioInRange">
<property name="text">
<string>In range</string>
</property>
<property name="checked">
<bool>true</bool>
</property>
<attribute name="buttonGroup">
<string notr="true">beadSelectionModeGroup</string>
</attribute>
</widget>
</item>
<item row="1" column="3">
<widget class="QRadioButton" name="radioEnd">
<property name="text">
<string>End</string>
</property>
<attribute name="buttonGroup">
<string notr="true">beadSelectionModeGroup</string>
</attribute>
</widget>
</item>
<item row="1" column="1">
<widget class="QRadioButton" name="radioMiddle">
<property name="text">
<string>Middle</string>
</property>
<attribute name="buttonGroup">
<string notr="true">beadSelectionModeGroup</string>
</attribute>
</widget>
</item>
</layout>
</widget>
</item>
<item>
<widget class="QGroupBox" name="groupBox">
<property name="sizePolicy">
<sizepolicy hsizetype="Preferred" vsizetype="Fixed">
<horstretch>0</horstretch>
<verstretch>0</verstretch>
</sizepolicy>
</property>
<property name="minimumSize">
<size>
<width>0</width>
<height>0</height>
</size>
</property>
<property name="baseSize">
<size>
<width>0</width>
<height>150</height>
</size>
</property>
<property name="title">
<string>Colour options</string>
</property>
<layout class="QVBoxLayout" name="verticalLayout_3">
<item>
<widget class="QRadioButton" name="radioSingleColor">
<property name="text">
<string>Use single colour</string>
</property>
<property name="checked">
<bool>true</bool>
</property>
<attribute name="buttonGroup">
<string notr="true">colourButtonGroup</string>
</attribute>
</widget>
</item>
<item>
<widget class="QRadioButton" name="radioScoreColor">
<property name="text">
<string>Use score for colours</string>
</property>
<attribute name="buttonGroup">
<string notr="true">colourButtonGroup</string>
</attribute>
</widget>
</item>
<item>
<widget class="QRadioButton" name="radioColorColor">
<property name="text">
<string>Use colour from file</string>
</property>
<attribute name="buttonGroup">
<string notr="true">colourButtonGroup</string>
</attribute>
</widget>
</item>
<item>
<widget class="QStackedWidget" name="stackedWidget">
<property name="sizePolicy">
<sizepolicy hsizetype="Preferred" vsizetype="Preferred">
<horstretch>0</horstretch>
<verstretch>0</verstretch>
</sizepolicy>
</property>
<property name="minimumSize">
<size>
<width>0</width>
<height>92</height>
</size>
</property>
<property name="baseSize">
<size>
<width>100</width>
<height>100</height>
</size>
</property>
<property name="currentIndex">
<number>1</number>
</property>
<widget class="QWidget" name="page">
<property name="sizePolicy">
<sizepolicy hsizetype="Preferred" vsizetype="Preferred">
<horstretch>0</horstretch>
<verstretch>0</verstretch>
</sizepolicy>
</property>
<property name="minimumSize">
<size>
<width>0</width>
<height>0</height>
</size>
</property>
<layout class="QVBoxLayout" name="verticalLayout_2">
<property name="topMargin">
<number>0</number>
</property>
<item>
<layout class="QHBoxLayout" name="horizontalLayout_2">
<property name="sizeConstraint">
<enum>QLayout::SetDefaultConstraint</enum>
</property>
<item>
<widget class="QLabel" name="label_5">
<property name="text">
<string>Colour</string>
</property>
</widget>
</item>
<item>
<widget class="QColourPicker" name="colorPicker">
<property name="sizePolicy">
<sizepolicy hsizetype="Fixed" vsizetype="Fixed">
<horstretch>0</horstretch>
<verstretch>0</verstretch>
</sizepolicy>
</property>
<property name="minimumSize">
<size>
<width>23</width>
<height>23</height>
</size>
</property>
<property name="maximumSize">
<size>
<width>23</width>
<height>23</height>
</size>
</property>
<property name="baseSize">
<size>
<width>23</width>
<height>23</height>
</size>
</property>
<property name="styleSheet">
<string notr="true"/>
</property>
<property name="text">
<string>n</string>
</property>
</widget>
</item>
<item>
<spacer name="horizontalSpacer">
<property name="orientation">
<enum>Qt::Horizontal</enum>
</property>
<property name="sizeHint" stdset="0">
<size>
<width>40</width>
<height>20</height>
</size>
</property>
</spacer>
</item>
</layout>
</item>
<item>
<spacer name="verticalSpacer_2">
<property name="orientation">
<enum>Qt::Vertical</enum>
</property>
<property name="sizeHint" stdset="0">
<size>
<width>20</width>
<height>40</height>
</size>
</property>
</spacer>
</item>
</layout>
</widget>
<widget class="QWidget" name="page_2">
<layout class="QVBoxLayout" name="verticalLayout_9">
<property name="topMargin">
<number>0</number>
</property>
<item>
<layout class="QHBoxLayout" name="horizontalLayout">
<item>
<layout class="QVBoxLayout" name="verticalLayout_8">
<item>
<widget class="QComboBox" name="scoreOrPercentile">
<item>
<property name="text">
<string>Score</string>
</property>
</item>
<item>
<property name="text">
<string>Percentile</string>
</property>
</item>
</widget>
</item>
<item>
<widget class="QLabel" name="label_3">
<property name="text">
<string>Colour gradient</string>
</property>
</widget>
</item>
</layout>
</item>
<item>
<layout class="QVBoxLayout" name="verticalLayout_7">
<item>
<widget class="QLineEdit" name="startGradient">
<property name="text">
<string>0</string>
</property>
</widget>
</item>
<item>
<widget class="QColourPicker" name="colorPickerStartGradient">
<property name="sizePolicy">
<sizepolicy hsizetype="Fixed" vsizetype="Fixed">
<horstretch>0</horstretch>
<verstretch>0</verstretch>
</sizepolicy>
</property>
<property name="minimumSize">
<size>
<width>23</width>
<height>23</height>
</size>
</property>
<property name="maximumSize">
<size>
<width>23</width>
<height>23</height>
</size>
</property>
<property name="baseSize">
<size>
<width>23</width>
<height>23</height>
</size>
</property>
<property name="styleSheet">
<string notr="true"/>
</property>
<property name="text">
<string>n</string>
</property>
</widget>
</item>
</layout>
</item>
<item>
<layout class="QVBoxLayout" name="verticalLayout_6">
<item>
<widget class="QLineEdit" name="endGradient">
<property name="text">
<string>1000</string>
</property>
</widget>
</item>
<item>
<widget class="QColourPicker" name="colorPickerEndGradient">
<property name="sizePolicy">
<sizepolicy hsizetype="Fixed" vsizetype="Fixed">
<horstretch>0</horstretch>
<verstretch>0</verstretch>
</sizepolicy>
</property>
<property name="minimumSize">
<size>
<width>23</width>
<height>23</height>
</size>
</property>
<property name="maximumSize">
<size>
<width>23</width>
<height>23</height>
</size>
</property>
<property name="baseSize">
<size>
<width>23</width>
<height>23</height>
</size>
</property>
<property name="styleSheet">
<string notr="true"/>
</property>
<property name="text">
<string>n</string>
</property>
</widget>
</item>
</layout>
</item>
</layout>
</item>
<item>
<widget class="QCheckBox" name="colourBlendCheckBox_2">
<property name="text">
<string>Use colour blend</string>
</property>
</widget>
</item>
<item>
<layout class="QHBoxLayout" name="horizontalLayout_4">
<item>
<widget class="QLabel" name="label_8">
<property name="text">
<string>Conflict colour</string>
</property>
</widget>
</item>
<item>
<widget class="QColourPicker" name="conflictColorPicker_2">
<property name="sizePolicy">
<sizepolicy hsizetype="Fixed" vsizetype="Fixed">
<horstretch>0</horstretch>
<verstretch>0</verstretch>
</sizepolicy>
</property>
<property name="minimumSize">
<size>
<width>23</width>
<height>23</height>
</size>
</property>
<property name="maximumSize">
<size>
<width>23</width>
<height>23</height>
</size>
</property>
<property name="baseSize">
<size>
<width>23</width>
<height>23</height>
</size>
</property>
<property name="styleSheet">
<string notr="true"/>
</property>
<property name="text">
<string>n</string>
</property>
</widget>
</item>
<item>
<spacer name="horizontalSpacer_3">
<property name="orientation">
<enum>Qt::Horizontal</enum>
</property>
<property name="sizeHint" stdset="0">
<size>
<width>40</width>
<height>20</height>
</size>
</property>
</spacer>
</item>
</layout>
</item>
<item>
<spacer name="verticalSpacer_3">
<property name="orientation">
<enum>Qt::Vertical</enum>
</property>
<property name="sizeHint" stdset="0">
<size>
<width>0</width>
<height>0</height>
</size>
</property>
</spacer>
</item>
</layout>
</widget>
<widget class="QWidget" name="page_3">
<layout class="QVBoxLayout" name="verticalLayout_4">
<property name="topMargin">
<number>0</number>
</property>
<item>
<widget class="QCheckBox" name="colourBlendCheckBox">
<property name="text">
<string>Use colour blend</string>
</property>
</widget>
</item>
<item>
<layout class="QHBoxLayout" name="horizontalLayout_3">
<item>
<widget class="QLabel" name="label_4">
<property name="text">
<string>Conflict colour</string>
</property>
</widget>
</item>
<item>
<widget class="QColourPicker" name="conflictColorPicker">
<property name="sizePolicy">
<sizepolicy hsizetype="Fixed" vsizetype="Fixed">
<horstretch>0</horstretch>
<verstretch>0</verstretch>
</sizepolicy>
</property>
<property name="minimumSize">
<size>
<width>23</width>
<height>23</height>
</size>
</property>
<property name="maximumSize">
<size>
<width>23</width>
<height>23</height>
</size>
</property>
<property name="baseSize">
<size>
<width>23</width>
<height>23</height>
</size>
</property>
<property name="styleSheet">
<string notr="true"/>
</property>
<property name="text">
<string>n</string>
</property>
</widget>
</item>
<item>
<spacer name="horizontalSpacer_2">
<property name="orientation">
<enum>Qt::Horizontal</enum>
</property>
<property name="sizeHint" stdset="0">
<size>
<width>40</width>
<height>20</height>
</size>
</property>
</spacer>
</item>
</layout>
</item>
<item>
<spacer name="verticalSpacer">
<property name="orientation">
<enum>Qt::Vertical</enum>
</property>
<property name="sizeHint" stdset="0">
<size>
<width>20</width>
<height>40</height>
</size>
</property>
</spacer>
</item>
</layout>
</widget>
</widget>
</item>
</layout>
</widget>
</item>
<item>
<layout class="QFormLayout" name="formLayout">
<item row="2" column="0">
<widget class="QLabel" name="label">
<property name="text">
<string>Main model ID</string>
</property>
</widget>
</item>
<item row="2" column="1">
<widget class="QLineEdit" name="mainModelId">
<property name="text">
<string>1</string>
</property>
</widget>
</item>
<item row="3" column="0">
<widget class="QLabel" name="label_6">
<property name="text">
<string>New model name</string>
</property>
</widget>
</item>
<item row="3" column="1">
<widget class="QLineEdit" name="modelName">
<property name="text">
<string>bed_model</string>
</property>
</widget>
</item>
<item row="1" column="1">
<widget class="QCheckBox" name="hideOrg">
<property name="text">
<string/>
</property>
<property name="checked">
<bool>false</bool>
</property>
</widget>
</item>
<item row="1" column="0">
<widget class="QLabel" name="label_7">
<property name="text">
<string>Hide beads on main model</string>
</property>
</widget>
</item>
</layout>
</item>
<item>
<widget class="QPushButton" name="generateModelButton">
<property name="text">
<string>Generate Model</string>
</property>
</widget>
</item>
</layout>
</item>
</layout>
</widget>
</widget>
</item>
</layout>
</widget>
<customwidgets>
<customwidget>
<class>QColourPicker</class>
<extends>QPushButton</extends>
<header>.qcolourpicker.h</header>
</customwidget>
<customwidget>
<class>BrowseForm</class>
<extends>QLineEdit</extends>
<header>.browseform.h</header>
</customwidget>
</customwidgets>
<resources/>
<connections>
<connection>
<sender>colourButtonGroup</sender>
<signal>buttonClicked(int)</signal>
<receiver>stackedWidget</receiver>
<slot>setCurrentIndex(int)</slot>
<hints>
<hint type="sourcelabel">
<x>-1</x>
<y>-1</y>
</hint>
<hint type="destinationlabel">
<x>217</x>
<y>264</y>
</hint>
</hints>
</connection>
<connection>
<sender>colourBlendCheckBox</sender>
<signal>toggled(bool)</signal>
<receiver>label_4</receiver>
<slot>setDisabled(bool)</slot>
<hints>
<hint type="sourcelabel">
<x>81</x>
<y>215</y>
</hint>
<hint type="destinationlabel">
<x>74</x>
<y>222</y>
</hint>
</hints>
</connection>
<connection>
<sender>colourBlendCheckBox</sender>
<signal>toggled(bool)</signal>
<receiver>conflictColorPicker</receiver>
<slot>setDisabled(bool)</slot>
<hints>
<hint type="sourcelabel">
<x>111</x>
<y>215</y>
</hint>
<hint type="destinationlabel">
<x>104</x>
<y>245</y>
</hint>
</hints>
</connection>
</connections>
<buttongroups>
<buttongroup name="colourButtonGroup"/>
<buttongroup name="beadSelectionModeGroup"/>
</buttongroups>
</ui>
Update: Thanks a lot for the quick and comprehensive answer. For posterity the main fault that caused my issues was that I didn't know setting the minimum size back to 0x0 was not the same as resetting it. Resetting the minimum size of my scroll area and group boxes fixed it!
Solution
You've set a minimum height for the scrollAreaWidgetContents container of the scroll area. This results in overriding the minimumSizeHint of the container (which is computed using the minimum size required by all of its items and ensures that all widgets are properly displayed), so the scroll area forces it to be smaller than it should until that minimum height is reached, even if this makes some widgets unusuable or even invisible.
Reset that property completely (using the small red arrow button of the minimum size field) and the widgets will only be resized to their own minimum default size.
Also be aware that you've set a lot of other size related properties that should not be set unless really needed:
- the
baseSizeproperty is only useful for top level windows and if thesizeIncrementhas been set, it's not the "suggested" size of the widget (that depends on the widget'ssizeHint; reset all those properties, as they are useless for child widgets; - reset all
minimumSizeproperties that are set to0x0or, for container widgets, that are set with size that wouldn't probably allow their children to be properly displayed (same issue as the scroll area); - reset the size policies overrides, unless you really know how they work;
- reset the size hint of the spacers, as the stacked widget already takes care of the minimum size required for all its pages, so using a minimum height for spacers can result in having unused blank spaces;
All the reset indications above mean using the small red arrow button, which actually resets the property to the default state of the widget. Note that manually setting a value to what appears to be the default one is not the same as resetting it: the default value of properties can depend on different aspects and might not be the same for all widgets and situations (including the OS/style), and while using the default (property unset) ensures that Qt properly uses the default expected behavior, explicitly setting a value might not have the same result even if it seems the default.
Further suggestions:
- the
scrollAreaWidgetContentsalready has a vertical layout set, but you're using a further nested vertical layout that is almost useless. Move every widget from that nested layout to the main one of the scroll area and delete that layout; - form layouts are normally suggested for extended (and possibly dynamic) interfaces; you can use a normal grid layout for the bottom part, since it only contains 3 widgets, and you should also set the checkbox text instead of using a label (the standard convention for checkboxes says that their label should be on the right);
- check the tab order, because it seems a bit confused;
Answered By - musicamante
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.