How to reset the column span of a widget in a QGridLayout? - python

Is possible to set the column span of a QLineEdit box after it has been added to the layout? I have two QLineEdit boxes in a QGridLayout that are right next to each other horizontally. During the execution of some of my code, one of these boxes gets hidden. I would like to increase the column span where the hidden one was to avoid a weird gap at the end, and reduce it when needed.
I couldn't really find anything in the Qt documentation for this type of change beyond making the adjustment prior to adding the widget to the layout.

There no method for resetting the row- or column-span after a widget has been added. However, addWidget can be called again on the same widget to achieve the same affect, because re-adding a widget to the same layout always implicitly removes it first. So something like this should work:
index = layout.indexOf(widget)
row, column = layout.getItemPosition(index)[:2]
layout.addWidget(widget, row, column, rowspan, colspan)
Here is a simple demo script:
import sys
from PyQt5 import QtCore, QtWidgets
class Window(QtWidgets.QWidget):
def __init__(self):
super(Window, self).__init__()
self.button = QtWidgets.QPushButton('Toggle Edit')
self.button.clicked.connect(self.handleButton)
self.edit1 = QtWidgets.QLineEdit()
self.edit1.setPlaceholderText('One')
self.edit2 = QtWidgets.QLineEdit()
self.edit2.setPlaceholderText('Two')
layout = QtWidgets.QGridLayout(self)
layout.addWidget(self.edit1, 0, 0)
layout.addWidget(self.edit2, 0, 1)
layout.addWidget(self.button, 1, 0)
def handleButton(self):
if self.edit2.isHidden():
self.setWidgetSpan(self.edit1, 1, 1)
self.edit2.setHidden(False)
else:
self.edit2.setHidden(True)
self.setWidgetSpan(self.edit1, 1, 2)
def setWidgetSpan(self, widget, rowspan=1, colspan=1):
layout = self.layout()
index = layout.indexOf(widget)
row, column = layout.getItemPosition(index)[:2]
layout.addWidget(widget, row, column, rowspan, colspan)
if __name__ == '__main__':
app = QtWidgets.QApplication(sys.argv)
window = Window()
window.setGeometry(600, 100, 300, 100)
window.show()
sys.exit(app.exec_())

Try as said below.
When you add two QLineEdit, The QGridLayout dynamically creates two columns.
If you want extra columns for spanning use QSpacerItem and get extra columns.
And you have to use addItem(..,..,..) of QGridLayout to add the spacer item to layout.
Between your two QLineEdit add spacers as shown below
spacer = QtGui.QSpacerItem(20, 20)
layout.addItem(spacer,0,1)
Now if you add totak 4 spacers (for example) ,
spacer1 = QtGui.QSpacerItem(20, 20)
layout.addItem(spacer1,0,2)
spacer2 = QtGui.QSpacerItem(20, 20)
layout.addItem(spacer2,0,3)
spacer3 = QtGui.QSpacerItem(20, 20)
layout.addItem(spacer3,0,4)
Now you have total 6 columns ------- with first QLineEdit (column 0), 4 spacers, last QLineEdit (column 5)
Now you can use setColumnStretch(column,stretch) to set the span of any line edit. Here I am trying to set span for last QLineEdit..as shown below. Spanned for 3 columns...
layout.setColumnStretch(5,3)
Hope this helps...

Related

How to make QGridLayout resize cells the exact same size?

Whenever I resize the window (a QDialog), Reference Viewer and Selected Viewer (subclasses of QScrollArea) should have the exact same size at all time, even after a resize event.
However, once out of twice, I get a size 1 pixel smaller for the Selected Viewer (QScrollArea widget on the right). By once out of twice, I mean every odd pixel count.
It seems that the QGridLayout is forcing the right-most panel to that smaller size, probably due to rounding down the value of the space still available.
I use a QGridLayout because I need the toolbar to stay aligned in the center between the panels and it works well.
Here is a screencast demonstrating the problem: you can see the scrollbar showing up every-time the Selected Viewer (panel on the right) is resized one pixel shorter in width compared to the panel on the left.
Here is mostly what I'm doing:
verticalLayout = QVBoxLayout(self)
verticalLayout.setSpacing(0)
verticalLayout.setContentsMargins(0, 0, 0, 0)
gridLayout = QGridLayout()
# Minimum width for the toolbar in the middle:
gridLayout.setColumnMinimumWidth(1, 30)
gridLayout.setColumnStretch(0,1)
gridLayout.setColumnStretch(1,0)
gridLayout.setColumnStretch(2,1)
gridLayout.setSpacing(3)
selectedImageViewer = ScrollAreaImageViewer(self)
gridLayout.addWidget(selectedImageViewer, 0, 0, 3, 1)
verticalToolBar = QToolBar(self)
verticalToolBar.setOrientation(Qt.Orientation(Qt.Vertical))
gridLayout.addWidget(verticalToolBar, 1, 1, 1, 1, Qt.AlignCenter)
referenceImageViewer = ScrollAreaImageViewer(self)
gridLayout.addWidget(referenceImageViewer, 0, 2, 3, 1)
verticalLayout.addLayout(gridLayout)
I add another widget below in the QVBoxLayout but it's irrelevant here.
I have tried adding spacers but it doesn't seem to change anything:
gridLayout.addItem(QSpacerItem(5,0, QSizePolicy.Minimum), 1, 3, 1, 1, Qt.Alignment(Qt.AlignCenter))
Is there a way to ensure both Viewers get the same size without using resize() on them on every resizeEvent()?
Or should this actually be considered a bug in Qt?
I have tried the following which works around the scrollbar flickering issue:
def resizeEvent(self, event):
self.gridLayout.setColumnMinimumWidth(0, self.selectedImageViewer.size().width())
self.gridLayout.setColumnMinimumWidth(2, self.selectedImageViewer.size().width())
But the sizes still differ by one pixel once out of twice.
Edit: here is a minimal reproducible example
from PyQt5.QtCore import QSize, Qt
from PyQt5.QtWidgets import (QDialog, QLayout, QVBoxLayout,
QLabel, QSizePolicy, QToolBar, QGridLayout,
QWidget, QApplication )
class MyWidget(QWidget):
def __init__(self, parent):
super().__init__(parent)
self.label = QLabel(self)
def resizeEvent(self, event):
self.label.setText(f"{self.size()}")
class MyDialog(QDialog):
def __init__(self, parent):
super().__init__(parent)
self.setMinimumSize(QSize(500, 100))
self.verticalLayout = QVBoxLayout(self)
self.verticalLayout.setSpacing(0)
self.verticalLayout.setContentsMargins(0, 0, 0, 0)
self.gridLayout = QGridLayout()
self.gridLayout.setColumnMinimumWidth(1, 30)
self.gridLayout.setColumnStretch(0,1)
self.gridLayout.setColumnStretch(1,0)
self.gridLayout.setColumnStretch(2,1)
self.gridLayout.setSpacing(3)
self.selectedImageViewer = MyWidget(self)
self.gridLayout.addWidget(self.selectedImageViewer, 0, 0, 3, 1)
self.verticalToolBar = QToolBar(self)
self.verticalToolBar.setOrientation(Qt.Orientation(Qt.Vertical))
self.gridLayout.addWidget(self.verticalToolBar, 1, 1, 1, 1, Qt.AlignCenter)
self.referenceImageViewer = MyWidget(self)
self.gridLayout.addWidget(self.referenceImageViewer, 0, 2, 3, 1)
self.verticalLayout.addLayout(self.gridLayout)
def main():
app = QApplication([()])
window = QWidget()
dialog = MyDialog(window)
dialog.show()
return app.exec()
if __name__ == "__main__":
main()
I assume that problem is with ScrollArea being used for referenceImageViewer, so in each resize event actual referenceImageViewer is trying to add a horizontal scrollbar to itself.
As a solution you can
Set referenceImageViewer's adjust policy to (QAbstractScrollArea.AdjustIgnored or QAbstractScrollArea.AdjustToContents).
Try to use Widgets instead of ScrollAreaImageViewer instances in gridLayout, and then adding ScrollAreaImageViewer inside that widgets.
Edited.
There must be difference between width of 1st and 3rd widgets as long
as ToolBar's width is fixed. E.g when window width is 501 and toolbar
width is fixed at 20 auto alignment can't equally divide remaining 481
pixels in a half..
As a solution your toolbar must be resizable too.
For reducing ToolBar width changes you can increase 1st and 3rd column
stretch in GridLayout for example to value 8, and set 2nd column
stretch to 1, so layout will automatically adjust width of each
column.

PyQt5: A Label Within A Label?

I'd like to make part of the text of a label clickable, like an inline hyperlink on a website. I know how to make an individual label clickable, but I'm not sure how to only make part of the label clickable and still maintain a consistent format.
I've placed the code for my first attempt below and included an image of the output.
The two issues I see are the noticeable space between the labels (which even a QStretchItem at the end doesn't fix) and the issues with word wrapping.
Any help would be greatly appreciated. Thank you!
from PyQt5.QtWidgets import *
app = QApplication([])
class MainWindow(QWidget):
def __init__(self, *args, **kwargs):
super(MainWindow, self).__init__(*args, **kwargs)
self.setWindowTitle('Title')
self.setGeometry(1200, 200, 350, 500)
self.layout = QVBoxLayout()
self.setLayout(self.layout)
# Dummy list to print
place_list = { '2000': 'An event happened.',
'2005': 'An event at {this place} happened long ago.',
'2010': 'Another event happened at {a different place}, but it was not fun.' }
# Initialize Grid of Notes
grid = QGridLayout()
# Create Headers for each column
grid.addWidget(QLabel('Date'), 0, 0)
grid.addWidget(QLabel('Note'), 0, 1)
index = 1
# Iterate through each entry in place_list
for year in place_list:
# Add index of entry (by year)
grid.addWidget(QLabel(year), index, 0)
# Get text of entry
note = place_list[year]
# Look for "{}" to indicate link
if '{' in note:
# Get location of link within the entry
start = note.find('{')
end = note.find('}')
# Create a label for the text before the link
lab_1 = QLabel(note[:start])
lab_1.setWordWrap(True)
# Create a label for the link
# NOTE: It's a QLabel for formatting purposes only
lab_2 = QLabel(note[start+1:end])
lab_2.setWordWrap(True)
# Create a label for the text after the link
lab_3 = QLabel(note[end+1:])
lab_3.setWordWrap(True)
# Combine the labels in one layout
note_lab = QHBoxLayout()
note_lab.addWidget(lab_1)
note_lab.addWidget(lab_2)
note_lab.addWidget(lab_3)
# Add the layout as the entry
grid.addLayout(note_lab, index, 1)
else:
# Create the label for the whole entry if no link indicator is found
note_lab = QLabel(note)
note_lab.setWordWrap(True)
grid.addWidget(note_lab, index, 1)
# Go to next row in grid
index += 1
self.layout.addLayout(grid)
window = MainWindow()
window.show()
app.exec_()
The best solution I believe is to subclass QLabel and override the mousePressEvent method.
def mousePressEvent(event):
# event.pos() or .x() and .y() to find the position of the click.
If you create a QRect in the area that you want in the initialization of your custom QLabel, you can easily check if the click is inside the rectangle by using the QRect.contains() method as well.
Other useful methods for this would be mouseReleaseEvent and mouseDoubleClickEvent.
And in general, when you are adding/changing functionality to widgets, look to subclass first.

How to prevent window and widgets in a pyqt5 application from changing size when the visibility of one widget is altered

I want to create a dialog, in which the user should first select one item in a drop down, and for some choices specify an additional parameter. For the sake of the example let's say that the possible choices are A and B and for B the user has to enter a text. The text field should not be visible when A is selected.
Here is a MWE:
#!/usr/bin/env python
import sys
from PyQt5.QtWidgets import QApplication, QComboBox, QDialog, QGridLayout, QLineEdit
class Example(QDialog) :
def __init__(self, parent=None) :
super(QDialog, self).__init__(parent)
self.mainLayout = QGridLayout()
self.setLayout(self.mainLayout)
self.comboBox = QComboBox()
self.comboBox.addItems(['A', 'B'])
self.mainLayout.addWidget(self.comboBox, 0, 0)
self.lineEdit = QLineEdit('')
self.lineEdit.setMinimumWidth(50)
self.mainLayout.addWidget(self.lineEdit, 0, 1)
self.comboBox.activated[str].connect(self.update)
self.update(str(self.comboBox.currentText()))
def update(self, choice) :
if 'B' in choice :
self.lineEdit.setVisible(True)
else :
self.lineEdit.setVisible(False)
if __name__ == '__main__':
app = QApplication(sys.argv)
example = Example()
example.show()
sys.exit(app.exec_())
The problem is, that when initially choice A is presented, the size of the dialog is just enough for the comboBox. When option B is selected, the window is expanded and everything is as it should be. However, when option A is selected again, the comboBox' width increases, taking up all of the avalaible space, instead of leaving empty space to the right.
How can I have space allocated for the text field, no matter if visible or not? What am I missing here?
EDIT The answer by S.Nick solves the problem of the MWE in a way, but not the way I was hoping for: As soon as the scenario is more complex, widgets get reallocated again, e.g. if a QLabel is added in front of the comboBox
self.label = QLabel('label')
self.mainLayout.addWidget(self.label, 0, 0)
self.comboBox = QComboBox()
self.comboBox.addItems(['A', 'B'])
self.mainLayout.addWidget(self.comboBox, 0, 1, alignment=Qt.AlignLeft)
self.lineEdit = QLineEdit('', self)
self.lineEdit.setMinimumWidth(50)
self.mainLayout.addWidget(self.lineEdit, 0, 2)
then the comboBox is flipped around when changing the selection. What I want is that, once in the beginning space and position is allocated for each widget and that the space and position is permanent no matter if any widget is visible or not.
You could try something like this:
def __init__(self, parent=None) :
super(QDialog, self).__init__(parent)
self.mainLayout = QGridLayout()
self.setLayout(self.mainLayout)
self.label = QLabel('label')
self.mainLayout.addWidget(self.label, 0, 0)
self.comboBox = QComboBox()
self.comboBox.addItems(['A', 'B'])
self.mainLayout.addWidget(self.comboBox, 0, 1)
self.lineEdit = QLineEdit('', self)
self.lineEdit.setMinimumWidth(200)
self.mainLayout.addWidget(self.lineEdit, 0, 2)
self.comboBox.activated[str].connect(self.update)
self.mainLayout.setColumnStretch(2,1)
self.adjustSize()
self.update(str(self.comboBox.currentText()))
self.mainLayout.setColumnStretch(2,1) will make sure that the last column will take up all the extra horizontal space even when the line edit widget is hidden.
self.adjustSize() adjusts the size of the main window to the sum of the sizes of all its child widgets. Since at this point the line edit widget is still visible, its size is taken into account as well when the size of the main window is adjusted.
Screenshots
Initial window:
After selecting B:

Empty spaces between Widgets even with setSpacing(0)

from PyQt5.QtWidgets import *
from PyQt5.QtCore import *
import sys
data = {'dia': 23, 'mes': 8, 'ano': 2017}
class FormConfigBkpBD(QWidget):
senha = None
pathLine = None
def __init__(self, parent=None,instancia=None):
super(FormConfigBkpBD, self).__init__(parent)
mainLayout = QVBoxLayout()
mainLayout.setSpacing(0)
mainLayout.setContentsMargins(0, 0, 0, 0)
self.senha = QLineEdit()
self.senha.setEchoMode(QLineEdit.Password)
self.senha.setFixedSize(385, 25)
self.pathLine = QLineEdit()
self.pathLine.setFixedSize(355,25)
self.senha.setContentsMargins(0,0,0,0)
self.pathLine.setContentsMargins(0,0,0,0)
mainLayout.addWidget(self.pathLine,0,Qt.AlignTop)
mainLayout.addWidget(self.senha,0,Qt.AlignTop)
self.setWindowTitle("ConfiguraĆ§Ć£o de Backup - Banco de Dados")
self.setFixedSize(460,640)
self.setLayout(mainLayout)
def main():
app = QApplication(sys.argv)
bd = FormConfigBkpBD()
bd.show()
app.exec()
if __name__ == "__main__" :
main()
The above code shows only two widgets (QLineEdit), the original window has much more widgets, this is only for post here.
Why, even with setSpacing(0) and setContentsMargins(0,0,0,0) there's a space between widgets?
It's because of the combination between the fixed size of your window and the layout you are using. The vertical layout tries to distribute evenly (unless told otherwise) all of its children vertically and fill the whole window.
Here you have two widgets so the first one goes in the first cell and the second one goes in the second cell. Since you haven't set any alignment the default behaviour is present that is top left corner of each cell is where the widget is positioned. The rest is just filling the free space of the parent window which the layout is part of.
If you want not space between the widgets
either remove the fixed size of the window
or put more widgets in the layout until it's "full".
The first option might not be what you want to do (otherwise you would have probably not set it to fixed size in the first place). The second can be achieved by simply using a QSpacerItem (vertical one) that will take care of the empty space for you and push the widgets to the top where you want these to be:
mainLayout.addStretch(1)
You can also add the spacer manually if you need more control over its behaviour:
self.spacer = QSpacerItem(20, 40, QSizePolicy.Minimum, QSizePolicy.Expanding) # or Fixed
mainLayout.addItem(self.spacer)

Positioning widgets to QBoxLayout

I'm using PySide to build a GUI
I have a QBoxLayout that I have add some Widgets to, the problem is I want control their positions which I was not able to do, I tried what have been provided in the documentation page which is
addWidget( widg, int streatch, int alignment)
but it is not giving me what I want so the final look that I want is something like this
------------------------------------------------------------ ^^ **
&&&&&&
if the line ____ represents the whole window/ layout
I would like the widget which I named wid in my code to be like the dashed line --------
and the sliders to be in the same place as ^^
and finally the button to be in &&&&&
My second question is I want to add some labels to the sliders and to the como-box and I would like to determine the position how can I do that
here is my code
self.wid = GLWidget()
mainLayout = QtGui.QHBoxLayout()
mainLayout.addWidget(self.wid)
self.xSlider = self.createSlider()
self.ySlider = self.createSlider()
mainLayout.addWidget(self.xSlider)
mainLayout.addWidget(self.ySlider)
self.btn = QtGui.QPushButton('OK')
self.btn.resize(self.btn.sizeHint())
mainLayout.addWidget(self.btn)
self.combo = QtGui.QComboBox()
mainLayout.addWidget(self.combo)
self.setLayout(mainLayout)
self.setWindowTitle(self.tr("Hello GL"))
self.setGeometry(350, 350, 1000, 1000)
You could use a QGridLayout instead of QHBoxLayout and use QGridLayout's setColumnMinimumWidth method to dictate your required widget width.Like that:
mainLayout = QtGui.QGridLayout()
mainLayout.setColumnMinimumWidth(0, 100) #set column 0 width to 100 pixels
button = QtGui.QPushButton('OK')
mainLayout.addWidget(button, 0, 0) #adds the button to the widened column
and then continue to add the rest of the widgets.

Categories

Resources