3강. QVBoxLayout

1. QVBoxLayout
: 세로 방향 레이아웃 공식문서

import sys
from PySide6.QtWidgets import QApplication, QWidget, QPushButton, QVBoxLayout
class VBoxExample(QWidget):
def __init__(self):
super().__init__()
btn1 = QPushButton("One")
btn2 = QPushButton("Two")
btn3 = QPushButton("Three")
layout = QVBoxLayout(self)
layout.addWidget(btn1)
layout.addWidget(btn2)
layout.addWidget(btn3)
if __name__ == "__main__":
app = QApplication(sys.argv)
w = VBoxExample()
w.show()
sys.exit(app.exec())

2. Qt Designer 에서 QVBoxLayout 사용하기 (1)
위젯을 선택하고 레이아웃을 적용하면 → 선택한 위젯들만 묶는 부분 레이아웃이 만들어집니다.




3. Qt Designer 에서 QVBoxLayout 사용하기 (2)
`Break Layout`을 누르면 방금 만든 `QVBoxLayout` 묶음이 해제됩니다.
버튼들은 폼 위에 그대로 남아 있지만, 더 이상 `QVBoxLayout`이 버튼들의 위치와 크기를 관리하지 않습니다.

폼을 선택하고 레이아웃을 적용하면 → 폼 전체를 관리하는 최상위 레이아웃이 만들어집니다.


0. 학습 목표
이번 6.3 단계에서는 PySide6에서 위젯을 세로 방향으로 배치할 때 사용하는 QVBoxLayout을 학습합니다.
이전 단계에서 QHBoxLayout은 위젯을 왼쪽에서 오른쪽 방향으로 배치하는 가로 레이아웃이라고 배웠습니다.
이번에는 버튼이나 입력창을 위에서 아래 방향으로 차례대로 배치하는 세로 레이아웃을 살펴봅니다.
| 학습 목표 | 내용 |
| QVBoxLayout 개념 이해 | QVBoxLayout이 위젯을 세로 방향으로 배치하는 레이아웃이라는 점을 이해합니다. |
| addWidget() 순서 이해 | 위젯을 추가한 순서대로 위에서 아래로 배치된다는 점을 이해합니다. |
| QVBoxLayout(self) 구조 이해 | 레이아웃을 만들 때 부모 위젯을 바로 전달하면 해당 위젯에 레이아웃이 적용된다는 점을 이해합니다. |
| QHBoxLayout과 비교 | 가로 배치와 세로 배치의 차이를 비교하여 이해합니다. |
| Qt Designer 사용 흐름 이해 | Qt Designer에서 여러 위젯을 선택한 뒤 세로 레이아웃을 적용하는 흐름을 이해합니다. |
이번 단계의 핵심
QVBoxLayout은 위젯을 위에서 아래 방향으로 자동 배치하는 세로 방향 레이아웃입니다.
버튼 여러 개를 세로로 나열하거나, 입력 항목을 한 줄씩 아래로 배치할 때 자주 사용합니다.
1. QVBoxLayout이란?
1.1 QVBoxLayout의 기본 의미
QVBoxLayout은 PySide6에서 제공하는 레이아웃 클래스 중 하나입니다.
이름을 나누어 보면 의미를 쉽게 이해할 수 있습니다.
| 이름 | 의미 |
| Q | Qt에서 제공하는 클래스라는 의미입니다. |
| V | Vertical, 즉 세로 방향을 의미합니다. |
| BoxLayout | 위젯을 박스처럼 한 방향으로 배치하는 레이아웃 구조를 의미합니다. |
QVBoxLayout
↓
Vertical Box Layout
↓
위젯을 위에서 아래로 차례대로 배치하는 레이아웃
따라서 QVBoxLayout은 여러 개의 위젯을 한 줄씩 아래로 배치할 때 사용하는 레이아웃입니다.
1.2 QVBoxLayout이 필요한 경우
GUI 화면에서는 위젯을 위에서 아래로 차례대로 배치해야 하는 경우가 많습니다.
예를 들어 로그인 화면, 설정 화면, 입력 폼 화면은 보통 항목을 세로 방향으로 배치합니다.
| 사용 예시 | 설명 |
| 로그인 화면 | 아이디 입력창, 비밀번호 입력창, 로그인 버튼을 위에서 아래로 배치할 때 사용합니다. |
| 설정 화면 | 여러 설정 항목을 세로 방향으로 나열할 때 사용합니다. |
| 입력 폼 | 이름, 연락처, 주소 같은 입력 항목을 한 줄씩 배치할 때 사용합니다. |
| 버튼 목록 | 여러 기능 버튼을 세로 메뉴처럼 배치할 때 사용합니다. |
중요한 점
QVBoxLayout은 위젯의 좌표를 직접 지정하지 않습니다.
레이아웃에 위젯을 추가하면, 레이아웃이 자동으로 위치와 크기를 계산해서 세로 방향으로 배치합니다.
2. QVBoxLayout 기본 구조
2.1 기본 사용 흐름
QVBoxLayout을 사용하는 기본 흐름은 다음과 같습니다.
부모 위젯 생성
↓
버튼 같은 자식 위젯 생성
↓
QVBoxLayout 생성
↓
addWidget()으로 위젯 추가
↓
위에서 아래로 자동 배치
여기서 가장 중요한 메서드는 addWidget()입니다.
QVBoxLayout에서는 addWidget()으로 추가한 순서가 세로 배치 순서가 됩니다.
2.2 addWidget() 순서와 화면 배치

layout.addWidget(btn1)
layout.addWidget(btn2)
layout.addWidget(btn3)
위 코드는 버튼을 1번, 2번, 3번 순서로 레이아웃에 추가합니다.
QVBoxLayout은 세로 방향 레이아웃이므로 화면에는 다음과 같이 배치됩니다.
QVBoxLayout
[ One ]
[ Two ]
[ Three ]
즉, QVBoxLayout에서는 addWidget()의 순서가 위에서 아래로 이어집니다.
2.3 QHBoxLayout과 QVBoxLayout 비교
QHBoxLayout과 QVBoxLayout은 둘 다 위젯을 자동 배치하는 레이아웃입니다.
차이는 배치 방향입니다.
| 구분 | QHBoxLayout | QVBoxLayout |
| 방향 | 가로 방향 | 세로 방향 |
| 배치 흐름 | 왼쪽에서 오른쪽 | 위에서 아래 |
| 대표 예시 | 확인 / 취소 버튼 | 로그인 입력 폼 |
| 코드 | QHBoxLayout(self) | QVBoxLayout(self) |
QHBoxLayout
[ One ] [ Two ] [ Three ]
QVBoxLayout
[ One ]
[ Two ]
[ Three ]
2.4 QVBoxLayout(self)의 의미
이번 예제에서는 다음과 같이 QVBoxLayout을 생성합니다.
layout = QVBoxLayout(self)
여기서 self는 현재 클래스인 VBoxExample 객체를 의미합니다.
VBoxExample은 QWidget을 상속받은 창이므로, self는 현재 창 위젯이라고 이해할 수 있습니다.
즉, QVBoxLayout(self)는 QVBoxLayout을 만들면서 동시에 현재 창인 self에 레이아웃을 바로 설치하는 방식입니다.
self = 현재 창(QWidget)
↓
QVBoxLayout(self)
↓
현재 창에 QVBoxLayout 바로 적용
↓
addWidget()으로 추가한 버튼들이 세로 배치됨
참고
다음 두 코드는 비슷한 목적을 가집니다.
# 방법 1: 레이아웃을 만들 때 부모 위젯을 바로 전달
layout = QVBoxLayout(self)
# 방법 2: 레이아웃을 만든 뒤 setLayout()으로 적용
layout = QVBoxLayout()
self.setLayout(layout)
이번 예제에서는 첫 번째 방식인 QVBoxLayout(self)를 사용합니다.
3. 예제 코드
3.1 실습 준비
이번 예제는 PyCharm에서 진행합니다.
새 Python 파일을 만들고 파일명을 main.py로 저장합니다.
프로젝트 가상환경에는 PySide6가 설치되어 있어야 합니다.
3.2 main.py 예제 코드
import sys
from PySide6.QtWidgets import QApplication, QWidget, QPushButton, QVBoxLayout
class VBoxExample(QWidget):
def __init__(self):
super().__init__()
self.setWindowTitle("QVBoxLayout 예제")
self.resize(320, 180)
btn1 = QPushButton("One")
btn2 = QPushButton("Two")
btn3 = QPushButton("Three")
layout = QVBoxLayout(self)
layout.addWidget(btn1)
layout.addWidget(btn2)
layout.addWidget(btn3)
if __name__ == "__main__":
app = QApplication(sys.argv)
w = VBoxExample()
w.show()
sys.exit(app.exec())

이 예제는 버튼 3개를 만들고, QVBoxLayout을 사용해 버튼을 세로 방향으로 배치합니다.
VBoxExample(QWidget)
↓
QPushButton("One")
QPushButton("Two")
QPushButton("Three")
↓
QVBoxLayout(self)
↓
[ One ]
[ Two ]
[ Three ]
3.3 실행 결과 구조
프로그램을 실행하면 창 안에 버튼 3개가 위에서 아래 방향으로 배치됩니다.
┌──────────────────────────────┐
│ [ One ] │
│ │
│ [ Two ] │
│ │
│ [ Three ] │
└──────────────────────────────┘
창 크기를 변경하면 QVBoxLayout이 버튼의 위치와 크기를 자동으로 다시 계산합니다.
3.4 예제 파일
예제 파일은 main.py로 저장합니다.
4. 코드 분석
4.1 주석 포함 전체 코드
import sys # [1] 파이썬 실행 환경과 종료 처리를 위해 sys 모듈을 가져옴
from PySide6.QtWidgets import QApplication, QWidget, QPushButton, QVBoxLayout
# [2] PySide6에서 GUI 구성에 필요한 클래스들을 가져옴
# - QApplication: Qt GUI 프로그램 전체를 관리하는 클래스
# - QWidget: 화면에 표시되는 기본 창 위젯 클래스
# - QPushButton: 클릭 가능한 버튼 위젯 클래스
# - QVBoxLayout: 위젯을 세로 방향으로 배치하는 레이아웃 클래스
class VBoxExample(QWidget): # [3] QWidget을 상속받아 새 창 클래스를 정의
def __init__(self): # [4] VBoxExample 객체가 생성될 때 자동으로 실행되는 초기화 메서드
super().__init__() # [5] 부모 클래스(QWidget)의 초기화 기능을 먼저 실행
self.setWindowTitle("QVBoxLayout 예제") # [6] 창 제목 설정
self.resize(320, 180) # [7] 창 크기 설정
btn1 = QPushButton("One") # [8] 첫 번째 버튼 생성
btn2 = QPushButton("Two") # [9] 두 번째 버튼 생성
btn3 = QPushButton("Three") # [10] 세 번째 버튼 생성
layout = QVBoxLayout(self) # [11] QVBoxLayout 생성
# - self는 현재 창을 의미함
# - QVBoxLayout(self)는 현재 창에 레이아웃을 바로 적용하는 방식
layout.addWidget(btn1) # [12] 첫 번째 버튼을 레이아웃에 추가
layout.addWidget(btn2) # [13] 두 번째 버튼을 레이아웃에 추가
layout.addWidget(btn3) # [14] 세 번째 버튼을 레이아웃에 추가
# - QVBoxLayout에서는 추가한 순서대로 위에서 아래로 배치됨
if __name__ == "__main__": # [15] 이 파일을 직접 실행할 때만 아래 코드 실행
app = QApplication(sys.argv) # [16] Qt GUI 프로그램 실행을 관리하는 QApplication 객체 생성
w = VBoxExample() # [17] VBoxExample 창 객체 생성
w.show() # [18] 창을 화면에 표시
sys.exit(app.exec()) # [19] 이벤트 루프 시작
# - 창이 닫힐 때까지 사용자 입력과 화면 이벤트를 처리함
4.2 단계별 분석
1단계: 필요한 클래스 가져오기
from PySide6.QtWidgets import QApplication, QWidget, QPushButton, QVBoxLayout
이번 예제에서는 기본 창을 만들고, 버튼을 세로로 배치하기 위해 네 가지 클래스를 사용합니다.
| 클래스 | 역할 |
| QApplication | Qt GUI 프로그램 전체 실행을 관리합니다. |
| QWidget | 화면에 표시되는 기본 창을 만듭니다. |
| QPushButton | 클릭 가능한 버튼을 만듭니다. |
| QVBoxLayout | 위젯을 세로 방향으로 배치합니다. |
2단계: QWidget을 상속한 창 클래스 만들기
class VBoxExample(QWidget):
def __init__(self):
super().__init__()
VBoxExample 클래스는 QWidget을 상속받아 만든 사용자 정의 창 클래스입니다.
이 클래스 안에서 버튼을 만들고, QVBoxLayout을 적용합니다.
3단계: 버튼 3개 생성하기
btn1 = QPushButton("One")
btn2 = QPushButton("Two")
btn3 = QPushButton("Three")
화면에 배치할 버튼 3개를 생성합니다.
이 단계에서는 버튼 객체만 만든 상태입니다.
아직 버튼이 창 안에 배치된 것은 아닙니다.
4단계: QVBoxLayout 생성하기
layout = QVBoxLayout(self)
QVBoxLayout 객체를 생성합니다.
괄호 안에 self를 넣었으므로, 현재 창에 이 레이아웃이 바로 적용됩니다.
self
↓
현재 VBoxExample 창
↓
QVBoxLayout(self)
↓
현재 창의 세로 방향 레이아웃으로 적용
5단계: 레이아웃에 버튼 추가하기
layout.addWidget(btn1)
layout.addWidget(btn2)
layout.addWidget(btn3)
addWidget()은 레이아웃에 위젯을 추가하는 메서드입니다.
QVBoxLayout은 세로 방향 레이아웃이므로, 버튼은 추가한 순서대로 위에서 아래로 배치됩니다.
layout.addWidget(btn1) → [ One ]
layout.addWidget(btn2) → [ One ]
[ Two ]
layout.addWidget(btn3) → [ One ]
[ Two ]
[ Three ]
중요한 점
QVBoxLayout에서 위젯의 배치 순서는 addWidget()을 호출한 순서와 같습니다.
먼저 추가한 위젯이 위쪽에 배치되고, 나중에 추가한 위젯이 아래쪽에 이어서 배치됩니다.
5. Qt 위젯들을 선택하고 Lay Out Vertically를 누른 경우
5.1 선택한 위젯끼리만 세로 레이아웃으로 묶임
Qt Designer에서 폼 위에 버튼이나 입력창 같은 위젯을 여러 개 올려놓을 수 있습니다.
이때 위젯 몇 개를 선택한 뒤 Lay Out Vertically 버튼을 누르면, 선택한 위젯들만 하나의 세로 레이아웃으로 묶입니다.




즉, 폼 전체에 레이아웃이 적용된 것이 아니라, 선택한 위젯 묶음에만 QVBoxLayout이 적용된 상태입니다.
Form(QWidget)
└── verticalLayout
├── QPushButton
├── QPushButton
└── QPushButton
Object Inspector에서는 verticalLayout 같은 레이아웃 객체가 생긴 것을 확인할 수 있습니다.
Designer 화면에서는 선택한 위젯들이 하나의 세로 레이아웃 영역 안에 들어간 것처럼 보일 수 있습니다.
중요한 점
이때 생긴 것은 실제 화면에 보이는 QWidget이 아니라, 선택한 위젯들의 배치를 관리하는 QVBoxLayout 객체입니다.
겉으로는 레이아웃 영역이 생긴 것처럼 보이지만, 실제 역할은 선택한 위젯들을 세로 방향으로 정렬하는 배치 관리자입니다.
5.2 이 상태의 의미
예를 들어 버튼 3개를 선택하고 Lay Out Vertically를 누르면 버튼들은 다음처럼 세로로 정렬됩니다.
[ Button 1 ]
[ Button 2 ]
[ Button 3 ]
하지만 이 레이아웃은 폼 전체를 관리하는 레이아웃이 아닙니다.
선택한 버튼 3개만 관리하는 부분 레이아웃입니다.
| 구분 | 설명 |
| 적용 대상 | 선택한 위젯들 |
| 생성되는 구조 | 선택한 위젯들을 관리하는 QVBoxLayout |
| 폼 전체 관리 여부 | 아직 폼 전체를 관리하는 최상위 레이아웃은 아님 |
| 주요 목적 | 일부 위젯들을 세로로 묶어 정렬하기 |
정리
위젯들을 선택하고 Lay Out Vertically를 누르면, 선택한 위젯들만 QVBoxLayout으로 묶입니다.
이것은 폼 전체 레이아웃이 아니라 부분 레이아웃입니다.
6. Qt Break Layout을 한 경우
6.1 기존 레이아웃 묶음을 해제함
Break Layout은 이미 적용된 레이아웃을 해제하는 기능입니다.
앞에서 버튼 3개를 QVBoxLayout으로 묶었다면, Break Layout을 실행하면 그 묶음이 풀립니다.

Break Layout 전
Form(QWidget)
└── verticalLayout
├── QPushButton
├── QPushButton
└── QPushButton
Break Layout 후
Form(QWidget)
├── QPushButton
├── QPushButton
└── QPushButton
버튼 자체가 삭제되는 것은 아닙니다.
삭제되는 것은 버튼들을 관리하던 QVBoxLayout 구조입니다.
6.2 Break Layout 후 화면 상태
Break Layout을 하면 위젯들은 폼 위에 그대로 남아 있습니다.
하지만 더 이상 레이아웃이 위젯의 위치와 크기를 자동으로 관리하지 않습니다.
Break Layout 전
[ Button 1 ]
[ Button 2 ]
[ Button 3 ]
↑
QVBoxLayout이 세로 배치를 관리함
Break Layout 후
[ Button 1 ] [ Button 2 ] [ Button 3 ]
↑ ↑ ↑
각 위젯이 폼 위에 따로 놓인 상태
이 상태에서는 버튼들이 각각 독립적으로 폼 위에 놓여 있는 상태입니다.
따라서 창 크기를 바꿔도 버튼들이 레이아웃 기준으로 자연스럽게 재배치되지 않을 수 있습니다.
| 구분 | 설명 |
| 실행 기능 | 선택한 레이아웃을 해제합니다. |
| 위젯 삭제 여부 | 위젯은 삭제되지 않고 그대로 남습니다. |
| 레이아웃 관리 여부 | 해당 위젯들을 관리하던 레이아웃이 사라집니다. |
| 결과 상태 | 위젯들이 폼 위에 개별적으로 놓인 상태가 됩니다. |
중요한 점
Break Layout은 위젯을 삭제하는 기능이 아닙니다.
위젯을 묶고 있던 레이아웃만 해제하는 기능입니다.
7. Qt 그다음 폼을 선택하고 Lay Out Vertically를 누른 경우
7.1 폼 전체에 최상위 레이아웃이 적용됨
Break Layout으로 기존 묶음을 해제한 뒤, 이번에는 버튼이 아니라 폼 자체를 선택합니다.
그리고 Lay Out Vertically를 누르면 폼 전체에 QVBoxLayout이 적용됩니다.


이때 만들어지는 레이아웃은 선택한 위젯 묶음의 부분 레이아웃이 아니라, 폼 전체를 관리하는 최상위 레이아웃입니다.
Form(QWidget)
└── Top-Level QVBoxLayout
├── QPushButton
├── QPushButton
└── QPushButton
코드로 생각하면 다음과 비슷한 구조입니다.
layout = QVBoxLayout(self)
또는 다음 코드와도 같은 의미로 이해할 수 있습니다.
layout = QVBoxLayout()
self.setLayout(layout)
즉, 폼 자체가 QVBoxLayout을 기준으로 자식 위젯들의 위치와 크기를 관리하게 됩니다.
7.2 위젯 선택 레이아웃과 폼 선택 레이아웃의 차이
위젯을 선택해서 레이아웃을 적용한 경우와 폼을 선택해서 레이아웃을 적용한 경우는 겉으로 비슷해 보일 수 있습니다.
하지만 실제 의미는 다릅니다.
| 구분 | 위젯 선택 후 레이아웃 | 폼 선택 후 레이아웃 |
| 적용 대상 | 선택한 위젯들 | 폼 전체 |
| 레이아웃 종류 | 부분 레이아웃 | 최상위 레이아웃 |
| 관리 범위 | 선택한 위젯 묶음만 관리 | 폼 안의 자식 위젯 전체를 관리 |
| 창 크기 변경 대응 | 폼 전체 기준 대응은 부족할 수 있음 | 폼 크기 변경에 맞춰 위젯들이 자동 조정됨 |
| 코드 관점 | 선택한 위젯 그룹을 QVBoxLayout에 넣은 상태 | self.setLayout() 또는 QVBoxLayout(self)에 가까운 상태 |
7.3 실습에서 확인할 핵심 흐름
이 차이는 실습 과정에서 다음 흐름으로 확인하면 이해하기 쉽습니다.
1. 버튼 3개를 선택한다.
2. Lay Out Vertically를 누른다.
→ 버튼 3개만 QVBoxLayout으로 묶인다.
3. Break Layout을 누른다.
→ 버튼 묶음이 해제된다.
4. 폼 바탕을 선택한다.
5. Lay Out Vertically를 누른다.
→ 폼 전체에 QVBoxLayout이 적용된다.
따라서 같은 Lay Out Vertically 버튼을 눌러도, 무엇을 선택한 상태에서 눌렀는지에 따라 결과가 달라집니다.
이번 단계의 핵심
위젯을 선택하고 Lay Out Vertically를 누르면 선택한 위젯들만 묶는 부분 레이아웃이 만들어집니다.
폼을 선택하고 Lay Out Vertically를 누르면 폼 전체를 관리하는 최상위 레이아웃이 만들어집니다.
기억할 문장
QVBoxLayout으로 묶는 것과 폼 전체에 QVBoxLayout을 적용하는 것은 다릅니다.
위젯 선택은 부분 레이아웃, 폼 선택은 최상위 레이아웃입니다.
8. 정리
이번 단계에서는 PySide6에서 위젯을 세로 방향으로 배치하는 QVBoxLayout을 살펴보았습니다.
QVBoxLayout은 버튼, 입력창, 라벨 같은 위젯을 위에서 아래 방향으로 차례대로 배치할 때 사용합니다.
QPushButton 생성
↓
QVBoxLayout 생성
↓
addWidget()으로 버튼 추가
↓
위에서 아래로 세로 배치
↓
창 크기 변경 시 자동 재배치
| 개념 | 정리 |
| QVBoxLayout | 위젯을 세로 방향으로 배치하는 레이아웃입니다. |
| addWidget() | 레이아웃에 위젯을 추가합니다. |
| 추가 순서 | 먼저 추가한 위젯이 위쪽에, 나중에 추가한 위젯이 아래쪽에 배치됩니다. |
| QVBoxLayout(self) | 레이아웃을 생성하면서 현재 위젯에 바로 적용하는 방식입니다. |
| Qt Designer 방식 | 위젯을 선택한 뒤 Lay Out Vertically를 적용하여 세로 레이아웃을 만듭니다. |
| 부분 레이아웃 | 선택한 위젯 묶음에만 적용된 레이아웃입니다. |
| 최상위 레이아웃 | 폼 전체에 적용되어 자식 위젯 전체를 관리하는 레이아웃입니다. |
이번 단계에서 기억할 문장
QVBoxLayout은 위젯을 위에서 아래로 배치하는 세로 방향 레이아웃입니다.
코드에서는 QVBoxLayout과 addWidget()을 사용하고, Qt Designer에서는 Lay Out Vertically를 적용해 같은 구조를 만들 수 있습니다.
참고. 공식 문서로 확인하기
이번 예제에서 사용한 QVBoxLayout, QBoxLayout, Layout Management, .ui 파일, pyside6-uic는 Qt for Python 공식 문서에서 확인할 수 있습니다.
특히 이번 단계에서 중요한 부분은 QVBoxLayout이 위젯을 세로 방향으로 배치하는 레이아웃이라는 점입니다.
1. 공식 문서 참고 표
| 구분 | 공식 문서 | 확인할 내용 |
| QVBoxLayout | PySide6.QtWidgets.QVBoxLayout | QVBoxLayout이 위젯을 세로 방향으로 정렬하는 레이아웃 클래스임을 확인할 수 있습니다. |
| QBoxLayout | PySide6.QtWidgets.QBoxLayout | QHBoxLayout과 QVBoxLayout이 Box Layout 계열의 편의 클래스라는 점을 확인할 수 있습니다. |
| Layout Management | Qt for Python - Layout Management | Qt 레이아웃 시스템이 부모 위젯 안에서 자식 위젯을 자동 배치하는 구조를 확인할 수 있습니다. |
| Using .ui files | Using .ui files from Designer or QtCreator | Qt Designer에서 만든 .ui 파일을 PySide6 프로젝트에서 사용하는 방법을 확인할 수 있습니다. |
| pyside6-uic | Qt for Python - pyside6-uic | .ui 파일을 Python 코드 파일로 변환하는 명령 도구를 확인할 수 있습니다. |
2. QVBoxLayout 공식 문서 연결
공식 문서에서 QVBoxLayout은 위젯을 세로 방향으로 정렬하는 레이아웃 클래스로 설명됩니다.
이번 예제에서 버튼 3개가 위에서 아래로 배치되는 이유가 바로 이 특징 때문입니다.
QVBoxLayout
↓
Vertical 방향
↓
addWidget() 순서대로 위젯 배치
↓
[ One ]
[ Two ]
[ Three ]
3. 이번 예제와 공식 문서 연결
| 이번 예제 코드 | 공식 문서와 연결되는 의미 |
| QVBoxLayout(self) | 세로 방향 레이아웃을 생성하고 현재 QWidget에 적용합니다. |
| layout.addWidget(btn1) | 첫 번째 버튼을 레이아웃에 추가합니다. |
| layout.addWidget(btn2) | 두 번째 버튼을 첫 번째 버튼 아래쪽에 배치합니다. |
| layout.addWidget(btn3) | 세 번째 버튼을 두 번째 버튼 아래쪽에 배치합니다. |
| pyside6-uic form.ui -o ui_form.py | Designer에서 만든 .ui 화면을 Python 코드 파일로 변환합니다. |
4. 정리 흐름도
공식 문서 기준으로 정리하면 다음과 같습니다.
QWidget
↓
QVBoxLayout
↓
addWidget()
↓
자식 위젯을 세로 방향으로 배치
↓
창 크기 변경 시 레이아웃이 위치와 크기 자동 관리
즉, QVBoxLayout은 PySide6에서 가장 기본적으로 사용하는 세로 방향 화면 배치 도구입니다.