PyQt QVBoxLayout

Resumo : neste tutorial, você aprenderá como usar o PyQt QVBoxLayoutpara organizar widgets verticalmente.

Introdução ao PyQt QVBoxLayout

Divide QVBoxLayouto widget pai em caixas verticais e coloca os widgets filhos sequencialmente de cima para baixo.

Este programa ilustra como usar a QVBoxLayoutclasse:

import sys
from PyQt6.QtWidgets import QApplication, QWidget, QPushButton, QVBoxLayout


class MainWindow(QWidget):
    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)

        self.setWindowTitle('PyQt QVBoxLayout')

        # create a layout
        layout = QVBoxLayout()
        self.setLayout(layout)

        # create buttons and add them to the layout
        titles = ['Find Next', 'Find All', 'Close']
        buttons = [QPushButton(title) for title in titles]
        for button in buttons:
            layout.addWidget(button)

        # show the window
        self.show()


if __name__ == '__main__':
    app = QApplication(sys.argv)
    window = MainWindow()
    sys.exit(app.exec())
Linguagem de código:  Python  ( python )

Saída:

Como funciona.

Primeiro, crie um QVBoxLayoutobjeto:

layout = QVBoxLayout()Linguagem de código:  Python  ( python )

Em seguida, defina o layout chamando MainWindowseu setLayout()método:

self.setLayout(layout)Linguagem de código:  Python  ( python )

Em seguida, defina uma lista de três strings que representam os títulos dos botões:

titles = ['Find Next', 'Find All', 'Close']Linguagem de código:  JavaScript  ( javascript )

Depois disso, crie três botões ( QPushButton) da lista titlesusando uma compreensão de lista :

buttons = [QPushButton(title) for title in titles]

Por fim, adicione os botões ao layout usando um forloop:

for button in buttons:
    layout.addWidget(button)Linguagem de código:  Python  ( python )

Alinhamentos

Ele QVBoxLayoutestende cada tipo de widget de uma maneira específica. Por exemplo, o QVBoxLayouttrecho se estende QPushButtonhorizontalmente, não verticalmente.

Isso significa que quando você aumenta a largura do widget pai, a largura de todos os botões também aumenta:

PyQt QVBoxLayout - Redimensionar

No entanto, quando você aumenta a altura do widget pai, as alturas dos botões não mudam. Mais importante ainda, QVBoxLayoutaloca uniformemente os espaços do widget pai para cada botão:

PyQt QVBoxLayout - Espaços Verticais

Quando o widget pai tiver mais espaço para os widgets filhos, você poderá alinhar os widgets filhos dentro do widget pai usando espaçadores verticais.

Alinhar parte inferior

Para empurrar os botões para a parte inferior do widget pai, adicione um espaçador vertical no início do layout usando o addStretch()método do QVBoxLayoutobjeto:

PyQt QVBoxLayout - Alinhe a parte inferior com um espaçador vertical
import sys
from PyQt6.QtWidgets import QApplication, QWidget, QPushButton, QVBoxLayout


class MainWindow(QWidget):
    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)

        self.setWindowTitle('PyQt QVBoxLayout')

        # create a layout
        layout = QVBoxLayout()
        self.setLayout(layout)

        # add a spacer
        layout.addStretch()
        
        # create buttons and add them to the layout
        titles = ['Find Next', 'Find All', 'Close']
        buttons = [QPushButton(title) for title in titles]
        for button in buttons:
            layout.addWidget(button)

        # show the window
        self.show()


if __name__ == '__main__':
    app = QApplication(sys.argv)
    window = MainWindow()
    sys.exit(app.exec())

Linguagem de código:  Python  ( python )

Se você aumentar a altura da janela, o espaçador vertical se estenderá até o final da janela QVBoxLayoute deixará espaços suficientes para os botões:

Alinhar topo

Da mesma forma, você pode adicionar um espaçador vertical como o último item do layout para empurrar os botões para o topo, chamando o addStretch()método após adicionar os botões ao layout:

PyQt QVBoxLayout - Alinhe a parte superior com um espaçador vertical
import sys
from PyQt6.QtWidgets import QApplication, QWidget, QPushButton, QVBoxLayout


class MainWindow(QWidget):
    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)

        self.setWindowTitle('PyQt QVBoxLayout')

        # create a layout
        layout = QVBoxLayout()
        self.setLayout(layout)

        # create buttons and add them to the layout
        titles = ['Find Next', 'Find All', 'Close']
        buttons = [QPushButton(title) for title in titles]
        for button in buttons:
            layout.addWidget(button)

        # add a spacer
        layout.addStretch()

        # show the window
        self.show()


if __name__ == '__main__':
    app = QApplication(sys.argv)
    window = MainWindow()
    sys.exit(app.exec())

Linguagem de código:  Python  ( python )

Alinhar centro

Para alinhar os botões no centro do widget pai, adicione um espaçador vertical no início e outro no final do layout como este:

PyQt QVBoxLayout - Alinhar centro com espaçadores verticais
import sys
from PyQt6.QtWidgets import QApplication, QWidget, QPushButton, QVBoxLayout


class MainWindow(QWidget):
    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)

        self.setWindowTitle('PyQt QVBoxLayout')

        # create a layout
        layout = QVBoxLayout()
        self.setLayout(layout)

        # add a spacer
        layout.addStretch()

        # create buttons and add them to the layout
        titles = ['Find Next', 'Find All', 'Close']
        buttons = [QPushButton(title) for title in titles]
        for button in buttons:
            layout.addWidget(button)

        # add a spacer
        layout.addStretch()

        # show the window
        self.show()


if __name__ == '__main__':
    app = QApplication(sys.argv)
    window = MainWindow()
    sys.exit(app.exec())
Linguagem de código:  Python  ( python )

Observe que você pode adicionar um espaçador vertical entre os widgets no arquivo QVBoxLayout. Por exemplo, o seguinte adiciona um espaçador vertical entre o segundo e o terceiro botão:

import sys
from PyQt6.QtWidgets import QApplication, QWidget, QPushButton, QVBoxLayout


class MainWindow(QWidget):
    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)

        self.setWindowTitle('PyQt QVBoxLayout')

        # create a layout
        layout = QVBoxLayout()
        self.setLayout(layout)

        # create buttons
        find_next_btn = QPushButton('Find Next')
        find_all_btn = QPushButton('Find All')
        close_btn = QPushButton('Find All')

        # add the first & second buttons to the layout
        layout.addWidget(find_next_btn)
        layout.addWidget(find_all_btn)

        # add a spacer
        layout.addStretch()

        # add the third button
        layout.addWidget(close_btn)

        # show the window
        self.show()


if __name__ == '__main__':
    app = QApplication(sys.argv)
    window = MainWindow()
    sys.exit(app.exec())

Linguagem de código:  Python  ( python )

Configurando fatores de extensão de layout

O programa a seguir exibe três QLabelwidgets com diferentes cores de fundo vermelho, verde e azul usando QVBoxLayout:

import sys
from PyQt6.QtWidgets import QApplication, QWidget, QLabel, QVBoxLayout


class MainWindow(QWidget):
    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)

        self.setWindowTitle('PyQt QVBoxLayout')

        # create a layout
        layout = QVBoxLayout()
        self.setLayout(layout)

        # create buttons
        label_1 = QLabel()
        label_1.setStyleSheet('QLabel{background-color:red}')
        label_2 = QLabel()
        label_2.setStyleSheet('QLabel{background-color:green}')
        label_3 = QLabel()
        label_3.setStyleSheet('QLabel{background-color:blue}')

        layout.addWidget(label_1)
        layout.addWidget(label_2)
        layout.addWidget(label_3)

        # show the window
        self.show()


if __name__ == '__main__':
    app = QApplication(sys.argv)
    window = MainWindow()
    sys.exit(app.exec())Linguagem de código:  Python  ( python )

Observe que usamos as folhas de estilo para definir a cor de fundo dos QLabelwidgets.

Ao contrário QPushButtondos widgets, os QLabelwidgets se estendem vertical e horizontalmente quando você redimensiona o widget pai:

PyQt QVBoxLayout-QLabel

Para alocar espaços para cada QLabelwidget proporcionalmente, use o setStretchFactor()método com a seguinte sintaxe:

setStretchFactor(widget, factor)Linguagem de código:  Python  ( python )

O setStretchFactor()método define um trecho factorpara widgetesticar dentro do layout. Portanto, você precisa fazer setStretchFactor()o método depois de adicionar os widgets filhos ao layout.

O programa a seguir usa o setStretchFactor()método para definir os fatores de expansão para o primeiro, segundo e terceiro QLabelwidgets como 1, 2 e 3:

import sys
from PyQt6.QtWidgets import QApplication, QWidget, QLabel, QVBoxLayout


class MainWindow(QWidget):
    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)

        self.setWindowTitle('PyQt QVBoxLayout')

        # create a layout
        layout = QVBoxLayout()
        self.setLayout(layout)

        # create buttons
        label_1 = QLabel('')
        label_1.setStyleSheet('QLabel{background-color:red}')

        label_2 = QLabel('')
        label_2.setStyleSheet('QLabel{background-color:green}')

        label_3 = QLabel('')
        label_3.setStyleSheet('QLabel{background-color:blue}')

        layout.addWidget(label_1)
        layout.addWidget(label_2)
        layout.addWidget(label_3)

        layout.setStretchFactor(label_1, 1)
        layout.setStretchFactor(label_2, 2)
        layout.setStretchFactor(label_3, 3)

        # show the window
        self.show()


if __name__ == '__main__':
    app = QApplication(sys.argv)
    window = MainWindow()
    sys.exit(app.exec())

Linguagem de código:  Python  ( python )
PyQt QVBoxLayout - Fator de estiramento de layout

Devido aos fatores de extensão, o segundo QLabelwidget ocupa o dobro do espaço que o primeiro e o terceiro QLabelwidget usa um espaço três vezes maior que o primeiro.

Configurando espaços entre widgets

Por padrão, QVBoxLayoutdefine um espaço padrão entre os widgets. Para alterar os espaços entre os widgets, você usa o setSpacing()método.

O exemplo a seguir usa o setSpacing()método para definir os espaços entre QLabelos widgets como zero:

import sys
from PyQt6.QtWidgets import QApplication, QWidget, QLabel, QVBoxLayout


class MainWindow(QWidget):
    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)

        self.setWindowTitle('PyQt QVBoxLayout')

        # create a layout
        layout = QVBoxLayout()
        self.setLayout(layout)

        # create buttons
        label_1 = QLabel('')
        label_1.setStyleSheet('QLabel{background-color:red}')

        label_2 = QLabel('')
        label_2.setStyleSheet('QLabel{background-color:green}')

        label_3 = QLabel('')
        label_3.setStyleSheet('QLabel{background-color:blue}')

        layout.addWidget(label_1)
        layout.addWidget(label_2)
        layout.addWidget(label_3)

        layout.setSpacing(0)

        # show the window
        self.show()


if __name__ == '__main__':
    app = QApplication(sys.argv)
    window = MainWindow()
    sys.exit(app.exec())

Linguagem de código:  Python  ( python )

Saída:

PyQt QVBoxLayout - Configurando Espaços

Definir margens de conteúdo

Por padrão, QVBoxLayoutdefine margens esquerda, superior, direita e inferior específicas para um widget. Para alterar as margens, você usa o setContentsMargins()método:

setContentsMargins(self, left: int, top: int, right: int, bottom: int) -> NoneLinguagem de código:  PHP  ( php )

Por exemplo, o seguinte usa o setContentsMargins()método para definir as margens dos QLabelwidgets como zero:

import sys
from PyQt6.QtWidgets import QApplication, QWidget, QLabel, QVBoxLayout


class MainWindow(QWidget):
    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)

        self.setWindowTitle('PyQt QVBoxLayout')

        # create a layout
        layout = QVBoxLayout()
        self.setLayout(layout)

        # create buttons
        label_1 = QLabel('')
        label_1.setStyleSheet('QLabel{background-color:red}')

        label_2 = QLabel('')
        label_2.setStyleSheet('QLabel{background-color:green}')

        label_3 = QLabel('')
        label_3.setStyleSheet('QLabel{background-color:blue}')

        layout.addWidget(label_1)
        layout.addWidget(label_2)
        layout.addWidget(label_3)

        # set the contents margins
        layout.setContentsMargins(0, 0, 0, 0)

        # show the window
        self.show()


if __name__ == '__main__':
    app = QApplication(sys.argv)
    window = MainWindow()
    sys.exit(app.exec())

Linguagem de código:  Python  ( python )

Saída:

PyQt QVBoxLayout - Configurando margens de conteúdo

Resumo

  • Use PyQt QVBoxLayoutpara dividir o widget pai em caixas verticais e colocar os widgets filhos sequencialmente de cima para baixo.
  • Use o addStretch()método do QVBoxLayoutobjeto para adicionar um espaçador vertical ao layout para alinhar os widgets na parte superior, inferior ou central.
  • Use o setStretchFactor()método do QVBoxLayoutobjeto para definir um fator de expansão para um widget no layout.
  • Use o setSpacing()método do QVBoxLayoutobjeto para definir os espaços entre os widgets filhos.
  • Use o setContentsMargins()método do QVBoxLayoutobjeto para definir as margens esquerda, superior, direita e inferior do conteúdo.

Deixe um comentário

O seu endereço de email não será publicado. Campos obrigatórios marcados com *