Reputation: 339
I'm trying to make a side panel with pyqt. I'm able to make nice looking buttons but not able to fill the rest of the space with the same color.
My goal is to add the same blue color to space under the buttons, all the way to the bottom. Now my buttons are inside of a box layout which is inside of a widget (just to be able to set the style) which is inside of a grid cell which is inside of a widget.
I tried to add one more widget to the box layout, but it is not stretching to fill the space. I can set minimum height, but then if the window is resized, the blue area won't resize.
import sys
import PySide2.QtWidgets as qt
from PySide2 import QtCore, QtGui
import os
class main_page:
def create(self):
# Create main window
main_window = qt.QMainWindow()
# Set some parameters for main window
main_window.setGeometry(50,50,700,400)
main_window.setWindowTitle("Here will be name of the program")
# Create central widget that will contain layout to contain widgets. Eh...
central_widget = qt.QWidget()
central_widget.setStyleSheet("background: white;")
# Add central widget to main window
main_window.setCentralWidget(central_widget)
# Create main grid layout that will organize everything
main_grid = qt.QGridLayout(central_widget)
main_grid.setSpacing(0)
main_grid.setMargin(0)
# Create widget that will contain layout and now we can set style for the widget.
widget_that_would_not_be_needed_if_qt_would_not_be_so_stupid = qt.QWidget()
widget_that_would_not_be_needed_if_qt_would_not_be_so_stupid.setStyleSheet(
'''
QPushButton {
background: #FF005AA1;
color: white;
text-align: center;
border: none;
font-weight: 500;
font-size: 15px;
height: 48px;
width: 120px;
}
QPushButton:hover {
background-color: #FF014a82;
}
QPushButton:checked {
background: #FF01508c;
}
QPushButton:pressed {
color: #FF005AA1;
background: white;
}
''')
# On left side we will have some (or at least one) button
left_side_buttons = qt.QVBoxLayout(widget_that_would_not_be_needed_if_qt_would_not_be_so_stupid)
left_side_buttons.setSpacing(0)
left_side_buttons.setMargin(0)
# And add it to main box the left most cell
main_grid.addWidget(widget_that_would_not_be_needed_if_qt_would_not_be_so_stupid, 0, 0, alignment = QtCore.Qt.AlignTop)
main_grid.setRowStretch(0,1)
# Column 0 must not stretch
main_grid.setColumnStretch(0,0)
# Column 1 must stretch
main_grid.setColumnStretch(1,1)
# Add widgets to container
left_side_buttons.addWidget(qt.QPushButton("First button"))
left_side_buttons.addWidget(qt.QPushButton("Second button"))
# Add separator line
line = qt.QFrame()
line.setFrameShape(qt.QFrame.HLine)
line.setFrameShadow(qt.QFrame.Sunken)
left_side_buttons.addWidget(line)
# Add color for rest of the space
color_filler = qt.QWidget()
# I can use this to hack to make colored area bigger but it won't stretch
color_filler.setMinimumHeight(100)
left_side_buttons.addWidget(color_filler)
main_grid.addWidget(qt.QListView(), 0, 1)
main_window.show()
# Add list view to right side
main_grid.addWidget(qt.QListView(), 0, 1)
main_window.show()
return main_window
def main():
app = qt.QApplication(sys.argv)
my_main_page = main_page().create()
sys.exit(app.exec_())
if __name__ == '__main__':
main()
Here's what I get and what I want:
Upvotes: 0
Views: 1145
Reputation: 24430
Probably the easiest way to get what you want, is to do the following
Add QObject { background: #FF005AA1; }
to the style sheet of widget_that_would_not_be_needed_if_qt_would_not_be_so_stupid
.
Remove the alignment
argument when you add widget_that_would_not_be_needed_if_qt_would_not_be_so_stupid
to main_grid
(or use alignment = QtCore.Qt.AlignJustify
),
Replace color_filler
with a stretchable space at the bottom of left_side_buttons
(a stretchable space can be added via left_side_buttons.addStretch()
).
Screenshot:
Upvotes: 1