pythonlayoutpyqt5qtableviewqscrollarea

Extend QTableView parent widget height when window is resized


I would like to extend the height of ruleWhiteListWidget_2 if rulesWhiteListFileTBL height is increased. But as you can see in the example code below, the QTableView is overflowing its parent widget. I need the QTableView's parent and grandparent height to increase with the QTableView height, and then use the QScrollArea to scroll if the height extended the MainWindow. I played around with sizepolicy, but could not figure it out.

PyQt5 Designer UI Code:

<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
 <class>Dialog</class>
 <widget class="QDialog" name="Dialog">
  <property name="geometry">
   <rect>
    <x>0</x>
    <y>0</y>
    <width>1112</width>
    <height>718</height>
   </rect>
  </property>
  <property name="windowTitle">
   <string>Dialog</string>
  </property>
  <widget class="QScrollArea" name="scrollArea">
   <property name="geometry">
    <rect>
     <x>-10</x>
     <y>0</y>
     <width>1091</width>
     <height>701</height>
    </rect>
   </property>
   <property name="verticalScrollBarPolicy">
    <enum>Qt::ScrollBarAsNeeded</enum>
   </property>
   <property name="widgetResizable">
    <bool>true</bool>
   </property>
   <widget class="QWidget" name="scrollAreaWidgetContents_2">
    <property name="geometry">
     <rect>
      <x>0</x>
      <y>0</y>
      <width>1089</width>
      <height>699</height>
     </rect>
    </property>
    <property name="minimumSize">
     <size>
      <width>0</width>
      <height>0</height>
     </size>
    </property>
    <layout class="QVBoxLayout" name="verticalLayout_45">
     <item>
      <layout class="QVBoxLayout" name="verticalLayout_44">
       <item>
        <widget class="QWidget" name="ruleWhiteListWidget" native="true">
         <property name="sizePolicy">
          <sizepolicy hsizetype="Preferred" vsizetype="Preferred">
           <horstretch>0</horstretch>
           <verstretch>0</verstretch>
          </sizepolicy>
         </property>
         <property name="minimumSize">
          <size>
           <width>0</width>
           <height>200</height>
          </size>
         </property>
         <layout class="QHBoxLayout" name="horizontalLayout_17">
          <property name="sizeConstraint">
           <enum>QLayout::SetDefaultConstraint</enum>
          </property>
          <property name="leftMargin">
           <number>0</number>
          </property>
          <property name="topMargin">
           <number>0</number>
          </property>
          <property name="rightMargin">
           <number>0</number>
          </property>
          <property name="bottomMargin">
           <number>0</number>
          </property>
          <item>
           <layout class="QHBoxLayout" name="horizontalLayout_16">
            <item>
             <widget class="QWidget" name="ruleWhiteListWidget_2" native="true">
              <property name="sizePolicy">
               <sizepolicy hsizetype="Preferred" vsizetype="Preferred">
                <horstretch>0</horstretch>
                <verstretch>0</verstretch>
               </sizepolicy>
              </property>
              <layout class="QVBoxLayout" name="verticalLayout_43">
               <property name="sizeConstraint">
                <enum>QLayout::SetDefaultConstraint</enum>
               </property>
               <item>
                <layout class="QVBoxLayout" name="verticalLayout_41">
                 <item>
                  <widget class="QPushButton" name="rulesWhiteListFileBTN">
                   <property name="maximumSize">
                    <size>
                     <width>16777215</width>
                     <height>16777215</height>
                    </size>
                   </property>
                   <property name="styleSheet">
                    <string notr="true">#rulesWhiteListFileBTN{
background: #697181;
border: 1px solid #697181;
color: #fff;
font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;
font-size: 12px;
padding: 6px 16px;
font-weight:600;
}
#rulesWhiteListFileBTN::hover{
background:#41454e;
}</string>
                   </property>
                   <property name="text">
                    <string>Btn 1</string>
                   </property>
                  </widget>
                 </item>
                 <item>
                  <widget class="QTableView" name="rulesWhiteListFileTBL">
                   <property name="minimumSize">
                    <size>
                     <width>0</width>
                     <height>400</height>
                    </size>
                   </property>
                   <property name="maximumSize">
                    <size>
                     <width>16777215</width>
                     <height>16777215</height>
                    </size>
                   </property>
                   <property name="sizeIncrement">
                    <size>
                     <width>0</width>
                     <height>0</height>
                    </size>
                   </property>
                   <property name="styleSheet">
                    <string notr="true">#rulesWhiteListFileTBL{
                color:#fff;
                border:0px;
            }
            QHeaderView::section{
                background-color:#222;
                color:#fff;
                border:0;
            }</string>
                   </property>
                  </widget>
                 </item>
                </layout>
               </item>
              </layout>
             </widget>
            </item>
           </layout>
          </item>
         </layout>
        </widget>
       </item>
       <item>
        <widget class="QWidget" name="rulesEditorWidget" native="true">
         <layout class="QVBoxLayout" name="verticalLayout_69">
          <property name="leftMargin">
           <number>0</number>
          </property>
          <property name="topMargin">
           <number>0</number>
          </property>
          <property name="rightMargin">
           <number>0</number>
          </property>
          <property name="bottomMargin">
           <number>0</number>
          </property>
          <item>
           <layout class="QVBoxLayout" name="verticalLayout_70">
            <item>
             <widget class="QPlainTextEdit" name="rulesQlineeditor">
              <property name="minimumSize">
               <size>
                <width>0</width>
                <height>400</height>
               </size>
              </property>
              <property name="styleSheet">
               <string notr="true">color:#fff;
font: 14px;
font-family: Monospace;
padding:10px;
border:1px solid #1a1a1a;
border-left:0;</string>
              </property>
             </widget>
            </item>
           </layout>
          </item>
         </layout>
        </widget>
       </item>
      </layout>
     </item>
    </layout>
   </widget>
  </widget>
 </widget>
 <resources/>
 <connections/>
</ui>

Solution

  • Your current design is has several redundant container widgets and layouts that are complicating things unnecessarily. Basically, you just want the table to expand to take up any extra height whenever the dialog is resized larger than the combined minimum heights of the table and the editor; and when the dialog is resized smaller than the combined minimum, you want a vertical scroll-bar to appear.

    In order to make the solution clearer, I have reduced your design to an absolute minimum. It has only one container widget (named rulesWidget, which is the scroll-area container widget). This in turn has just one vertical layout set on it, which can be accessed by selecting the rulesWidget in the Property Editor and scrolling to the section at the bottom. If you do that, you will see that the layoutStretch has been set, which is what makes the table take up the extra space. Note also that the dialog itself must also have a layout set on it for everything to work properly:

    screenshot

    New UI file:

    <?xml version="1.0" encoding="UTF-8"?>
    <ui version="4.0">
     <class>Dialog</class>
     <widget class="QDialog" name="Dialog">
      <property name="geometry">
       <rect>
        <x>0</x>
        <y>0</y>
        <width>645</width>
        <height>695</height>
       </rect>
      </property>
      <property name="windowTitle">
       <string>Dialog</string>
      </property>
      <layout class="QVBoxLayout" name="verticalLayout_2">
       <item>
        <widget class="QScrollArea" name="scrollArea">
         <property name="widgetResizable">
          <bool>true</bool>
         </property>
         <widget class="QWidget" name="rulesWidget">
          <property name="geometry">
           <rect>
            <x>0</x>
            <y>0</y>
            <width>612</width>
            <height>853</height>
           </rect>
          </property>
          <layout class="QVBoxLayout" name="verticalLayout" stretch="0,1,0">
           <item>
            <widget class="QPushButton" name="rulesWhiteListFileBTN">
             <property name="styleSheet">
              <string notr="true">#rulesWhiteListFileBTN{
    background: #697181;
    border: 1px solid #697181;
    color: #fff;
    font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;
    font-size: 12px;
    padding: 6px 16px;
    font-weight:600;
    }
    #rulesWhiteListFileBTN::hover{
    background:#41454e;
    }</string>
             </property>
             <property name="text">
              <string>Btn 1</string>
             </property>
            </widget>
           </item>
           <item>
            <widget class="QTableView" name="rulesWhiteListFileTBL">
             <property name="minimumSize">
              <size>
               <width>0</width>
               <height>400</height>
              </size>
             </property>
             <property name="styleSheet">
              <string notr="true">#rulesWhiteListFileTBL{
                    color:#fff;
                    border:0px;
                }
                QHeaderView::section{
                    background-color:#222;
                    color:#fff;
                    border:0;
                }</string>
             </property>
            </widget>
           </item>
           <item>
            <widget class="QPlainTextEdit" name="rulesQlineeditor">
             <property name="minimumSize">
              <size>
               <width>0</width>
               <height>400</height>
              </size>
             </property>
             <property name="styleSheet">
              <string notr="true">color:#fff;
    font: 14px;
    font-family: Monospace;
    padding:10px;
    border:1px solid #1a1a1a;
    border-left:0;</string>
             </property>
            </widget>
           </item>
          </layout>
         </widget>
        </widget>
       </item>
      </layout>
     </widget>
     <resources/>
     <connections/>
    </ui>
    

    UPDATE:

    The minimum number of changes to get your original ui file to behave more or less the same as the above, are: (1) set a vertical-layout on the dialog; (2) remove the minimumSize on ruleWhiteListWidget; (3) set the layoutStretch to 1,0 on verticalLayout_44. Here is an updated ui-file with just those changes:

    <?xml version="1.0" encoding="UTF-8"?>
    <ui version="4.0">
     <class>Dialog</class>
     <widget class="QDialog" name="Dialog">
      <property name="geometry">
       <rect>
        <x>0</x>
        <y>0</y>
        <width>1112</width>
        <height>718</height>
       </rect>
      </property>
      <property name="windowTitle">
       <string>Dialog</string>
      </property>
      <layout class="QVBoxLayout" name="verticalLayout">
       <item>
        <widget class="QScrollArea" name="scrollArea">
         <property name="verticalScrollBarPolicy">
          <enum>Qt::ScrollBarAsNeeded</enum>
         </property>
         <property name="widgetResizable">
          <bool>true</bool>
         </property>
         <widget class="QWidget" name="scrollAreaWidgetContents_2">
          <property name="geometry">
           <rect>
            <x>0</x>
            <y>0</y>
            <width>1079</width>
            <height>873</height>
           </rect>
          </property>
          <property name="minimumSize">
           <size>
            <width>0</width>
            <height>0</height>
           </size>
          </property>
          <layout class="QVBoxLayout" name="verticalLayout_45">
           <item>
            <layout class="QVBoxLayout" name="verticalLayout_44" stretch="1,0">
             <item>
              <widget class="QWidget" name="ruleWhiteListWidget" native="true">
               <property name="sizePolicy">
                <sizepolicy hsizetype="Preferred" vsizetype="Preferred">
                 <horstretch>0</horstretch>
                 <verstretch>0</verstretch>
                </sizepolicy>
               </property>
               <layout class="QHBoxLayout" name="horizontalLayout_17">
                <property name="sizeConstraint">
                 <enum>QLayout::SetDefaultConstraint</enum>
                </property>
                <property name="leftMargin">
                 <number>0</number>
                </property>
                <property name="topMargin">
                 <number>0</number>
                </property>
                <property name="rightMargin">
                 <number>0</number>
                </property>
                <property name="bottomMargin">
                 <number>0</number>
                </property>
                <item>
                 <layout class="QHBoxLayout" name="horizontalLayout_16">
                  <item>
                   <widget class="QWidget" name="ruleWhiteListWidget_2" native="true">
                    <property name="sizePolicy">
                     <sizepolicy hsizetype="Preferred" vsizetype="Preferred">
                      <horstretch>0</horstretch>
                      <verstretch>0</verstretch>
                     </sizepolicy>
                    </property>
                    <layout class="QVBoxLayout" name="verticalLayout_43">
                     <property name="sizeConstraint">
                      <enum>QLayout::SetDefaultConstraint</enum>
                     </property>
                     <item>
                      <layout class="QVBoxLayout" name="verticalLayout_41">
                       <item>
                        <widget class="QPushButton" name="rulesWhiteListFileBTN">
                         <property name="maximumSize">
                          <size>
                           <width>16777215</width>
                           <height>16777215</height>
                          </size>
                         </property>
                         <property name="styleSheet">
                          <string notr="true">#rulesWhiteListFileBTN{
    background: #697181;
    border: 1px solid #697181;
    color: #fff;
    font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;
    font-size: 12px;
    padding: 6px 16px;
    font-weight:600;
    }
    #rulesWhiteListFileBTN::hover{
    background:#41454e;
    }</string>
                         </property>
                         <property name="text">
                          <string>Btn 1</string>
                         </property>
                        </widget>
                       </item>
                       <item>
                        <widget class="QTableView" name="rulesWhiteListFileTBL">
                         <property name="minimumSize">
                          <size>
                           <width>0</width>
                           <height>400</height>
                          </size>
                         </property>
                         <property name="maximumSize">
                          <size>
                           <width>16777215</width>
                           <height>16777215</height>
                          </size>
                         </property>
                         <property name="sizeIncrement">
                          <size>
                           <width>0</width>
                           <height>0</height>
                          </size>
                         </property>
                         <property name="styleSheet">
                          <string notr="true">#rulesWhiteListFileTBL{
                    color:#fff;
                    border:0px;
                }
                QHeaderView::section{
                    background-color:#222;
                    color:#fff;
                    border:0;
                }</string>
                         </property>
                        </widget>
                       </item>
                      </layout>
                     </item>
                    </layout>
                   </widget>
                  </item>
                 </layout>
                </item>
               </layout>
              </widget>
             </item>
             <item>
              <widget class="QWidget" name="rulesEditorWidget" native="true">
               <layout class="QVBoxLayout" name="verticalLayout_69">
                <property name="leftMargin">
                 <number>0</number>
                </property>
                <property name="topMargin">
                 <number>0</number>
                </property>
                <property name="rightMargin">
                 <number>0</number>
                </property>
                <property name="bottomMargin">
                 <number>0</number>
                </property>
                <item>
                 <layout class="QVBoxLayout" name="verticalLayout_70">
                  <item>
                   <widget class="QPlainTextEdit" name="rulesQlineeditor">
                    <property name="minimumSize">
                     <size>
                      <width>0</width>
                      <height>400</height>
                     </size>
                    </property>
                    <property name="styleSheet">
                     <string notr="true">color:#fff;
    font: 14px;
    font-family: Monospace;
    padding:10px;
    border:1px solid #1a1a1a;
    border-left:0;</string>
                    </property>
                   </widget>
                  </item>
                 </layout>
                </item>
               </layout>
              </widget>
             </item>
            </layout>
           </item>
          </layout>
         </widget>
        </widget>
       </item>
      </layout>
     </widget>
     <resources/>
     <connections/>
    </ui>