7강. 주요 레이아웃 기능 살펴보기
1. Stretch Factor 예제
: 레이아웃 안의 남는 여유 공간을, 각 위젯에게 “어떤 비율로 나눠줄지” 결정하는 값
import sys
from PySide6.QtWidgets import QApplication, QWidget, QPushButton, QHBoxLayout
class StretchExample(QWidget):
def __init__(self):
super().__init__()
self.setWindowTitle("Stretch Factor 예제")
btn1 = QPushButton("버튼 1 (비율 1)")
btn2 = QPushButton("버튼 2 (비율 2)")
btn3 = QPushButton("버튼 3 (비율 1)")
layout = QHBoxLayout(self)
layout.addWidget(btn1, stretch=1)
layout.addWidget(btn2, stretch=2)
layout.addWidget(btn3, stretch=1)
if __name__ == "__main__":
app = QApplication(sys.argv)
w = StretchExample()
w.show()
sys.exit(app.exec())위젯 자체의 크기를 지정하는 게 아니라, 레이아웃 안에서 위젯들 사이·주변에 생기는 여유 공간을 어떻게 배분할지를 정하는 겁니다. 전체 여유 공간을 1 : 2 : 1 로 나눠서
- btn1 주변 영역 → 1
- btn2 주변 영역 → 2
- btn3 주변 영역 → 1
만큼 “비율”로 공간을 주는 효과입니다.
결과적으로 가운데 버튼이 양옆보다 더 넓게 보이는 UI가 됩니다.
2. SpacerItem 예제
: 버튼 사이에 늘어나는 빈 공간 넣기, 두 버튼 사이가 자동으로 넓어집니다.
import sys
from PySide6.QtWidgets import (
QApplication, QWidget, QPushButton,
QHBoxLayout, QSpacerItem, QSizePolicy
)
class SpacerExample(QWidget):
def __init__(self):
super().__init__()
self.setWindowTitle("SpacerItem 예제")
btn1 = QPushButton("왼쪽 버튼")
btn2 = QPushButton("오른쪽 버튼")
layout = QHBoxLayout(self)
layout.addWidget(btn1)
# 가운데에 늘어나는 빈 공간 추가
spacer = QSpacerItem(40, 20, QSizePolicy.Expanding, QSizePolicy.Minimum)
layout.addItem(spacer)
layout.addWidget(btn2)
if __name__ == "__main__":
app = QApplication(sys.argv)
w = SpacerExample()
w.show()
sys.exit(app.exec())버튼 사이, 왼쪽과 오른쪽 사이에 여백을 비워주고 싶을 때 사용
QSpacerItem도 사실상 SizePolicy를 가진 하나의 “보이지 않는 위젯”처럼 행동한다
3. SizePolicy 예제
: 가로는 늘어나고 세로는 고정, 버튼이 가로로 늘어나지만 세로 높이는 그대로 유지됩니다.
import sys
from PySide6.QtWidgets import (
QApplication, QWidget, QPushButton,
QVBoxLayout, QSizePolicy
)
class SizePolicyExample(QWidget):
def __init__(self):
super().__init__()
self.setWindowTitle("SizePolicy 예제")
btn = QPushButton("가로는 Expanding / 세로는 Fixed")
# 가로: 확대됨, 세로: 고정
btn.setSizePolicy(QSizePolicy.Expanding, QSizePolicy.Fixed)
layout = QVBoxLayout(self)
layout.addWidget(btn)
if __name__ == "__main__":
app = QApplication(sys.argv)
w = SizePolicyExample()
w.show()
sys.exit(app.exec())윈도우를 가로로 키우면 버튼 너비는 늘어나는데, 버튼 높이는 거의 변하지 않습니다.
btn.setSizePolicy(QSizePolicy.Expanding, QSizePolicy.Fixed)
- 가로 방향(Horizontal): Expanding
: 가능하면 옆으로 쭉쭉 넓어져도 좋다 - 세로 방향(Vertical): Fixed
: 세로 높이는 가능한 한 그대로 유지하고 싶다
비교
- Stretch는 “남는 공간을 누구에게 얼마나 줄까?”
- SizePolicy는 “공간을 받았을 때, 나는 커질 준비가 되어 있나?”
를 결정하는 역할입니다.
0. 학습 목표
이번 6.7 단계에서는 PySide6 레이아웃을 사용할 때 자주 만나는 주요 기능인 Stretch Factor, SpacerItem, SizePolicy를 학습합니다.
이전 단계까지는 QHBoxLayout, QVBoxLayout, QGridLayout, QFormLayout, 중첩 레이아웃처럼 위젯을 어떻게 배치할 것인가를 중심으로 살펴보았습니다.
이번 단계에서는 배치된 위젯들이 창 크기 변화에 따라 얼마나 늘어나는지, 어디에 빈 공간을 둘지, 어떤 방향으로 크기 변경을 허용할지를 살펴봅니다.
| 학습 목표 | 내용 |
| Stretch Factor 이해 | 레이아웃 안의 남는 공간을 위젯들에게 어떤 비율로 나눠줄지 결정하는 방식을 이해합니다. |
| SpacerItem 이해 | 레이아웃 안에 보이지 않는 빈 공간을 넣어 위젯 사이의 간격을 조절하는 방법을 이해합니다. |
| SizePolicy 이해 | 위젯이 가로 또는 세로 방향으로 크기가 변할 준비가 되어 있는지 설정하는 방법을 이해합니다. |
| Stretch와 SizePolicy 비교 | 공간을 나누는 비율과 위젯이 그 공간을 받아들이는 성격의 차이를 이해합니다. |
| 레이아웃 동작 감각 익히기 | 창 크기를 변경했을 때 위젯과 빈 공간이 어떻게 반응하는지 관찰합니다. |
이번 단계의 핵심
레이아웃은 위젯을 단순히 배치하는 것에서 끝나지 않습니다.
창 크기가 변할 때 남는 공간을 어떻게 나눌지, 빈 공간을 어디에 둘지, 위젯이 어느 방향으로 늘어날지까지 함께 관리합니다.
1. 주요 레이아웃 기능이란?
1.1 배치 이후의 문제
QHBoxLayout이나 QVBoxLayout을 사용하면 위젯을 가로 또는 세로 방향으로 쉽게 배치할 수 있습니다.
하지만 실제 프로그램에서는 다음과 같은 문제가 생깁니다.
| 상황 | 필요한 기능 |
| 가운데 버튼만 더 넓게 보이게 하고 싶다 | Stretch Factor |
| 왼쪽 버튼과 오른쪽 버튼 사이를 자동으로 벌리고 싶다 | SpacerItem |
| 위젯은 가로로만 늘어나고 세로 높이는 유지하고 싶다 | SizePolicy |
즉, 이번 단계에서 배우는 기능들은 위젯을 어디에 놓을지보다, 남는 공간을 어떻게 처리할지와 관련이 있습니다.
1.2 세 기능의 큰 차이
Stretch Factor, SpacerItem, SizePolicy는 모두 레이아웃의 크기 조정과 관련이 있지만 역할이 다릅니다.
| 기능 | 질문 | 역할 |
| Stretch Factor | 남는 공간을 누구에게 얼마나 줄까? | 공간 배분 비율 결정 |
| SpacerItem | 빈 공간을 어디에 둘까? | 보이지 않는 여백 생성 |
| SizePolicy | 공간을 받으면 위젯이 커져도 될까? | 위젯의 크기 변경 성향 결정 |
중요한 점
Stretch Factor는 비율, SpacerItem은 빈 공간, SizePolicy는 위젯의 크기 변경 성향과 관련이 있습니다.
세 기능은 비슷해 보이지만 실제로 해결하는 문제가 다릅니다.
2. Stretch Factor 예제
2.1 Stretch Factor의 의미
Stretch Factor는 레이아웃 안의 남는 여유 공간을 각 위젯에게 어떤 비율로 나눠줄지 결정하는 값입니다.
Stretch Factor
↓
레이아웃 안의 남는 공간
↓
각 위젯에게 비율대로 배분
↓
1 : 2 : 1 같은 상대적 크기 차이 생성중요한 점은 Stretch Factor가 위젯의 절대 크기를 직접 지정하는 값은 아니라는 것입니다.
레이아웃이 사용할 수 있는 여유 공간을 어느 항목이 더 많이 차지할지 정하는 상대적인 비율입니다.
2.2 예제 코드
import sys
from PySide6.QtWidgets import QApplication, QWidget, QPushButton, QHBoxLayout
class StretchExample(QWidget):
def __init__(self):
super().__init__()
self.setWindowTitle("Stretch Factor 예제")
btn1 = QPushButton("버튼 1 (비율 1)")
btn2 = QPushButton("버튼 2 (비율 2)")
btn3 = QPushButton("버튼 3 (비율 1)")
layout = QHBoxLayout(self)
layout.addWidget(btn1, stretch=1)
layout.addWidget(btn2, stretch=2)
layout.addWidget(btn3, stretch=1)
if __name__ == "__main__":
app = QApplication(sys.argv)
w = StretchExample()
w.show()
sys.exit(app.exec())
2.3 코드 구조 이해
핵심 코드는 다음 세 줄입니다.
layout.addWidget(btn1, stretch=1)
layout.addWidget(btn2, stretch=2)
layout.addWidget(btn3, stretch=1)이 코드는 세 버튼을 QHBoxLayout에 추가하면서 각각의 stretch 값을 지정합니다.
전체 비율은 다음과 같습니다.
btn1 : btn2 : btn3
1 : 2 : 1| 위젯 | stretch 값 | 의미 |
| btn1 | 1 | 기본 비율만큼 공간을 받습니다. |
| btn2 | 2 | btn1보다 약 2배 비율로 공간을 받습니다. |
| btn3 | 1 | btn1과 같은 비율로 공간을 받습니다. |
2.4 실행 결과 구조
창을 가로로 넓히면 가운데 버튼이 양옆 버튼보다 더 넓은 영역을 차지하는 것처럼 보입니다.
┌──────────────────────────────────────────────┐
│ [ 버튼 1 ] [ 버튼 2 ] [ 버튼 3 ] │
└──────────────────────────────────────────────┘
공간 배분 비율
1 : 2 : 1중요한 점
Stretch Factor는 위젯 자체의 픽셀 크기를 직접 지정하는 기능이 아닙니다.
레이아웃 안에서 남는 여유 공간을 어떤 비율로 나눌지 정하는 기능입니다.
3. SpacerItem 예제
3.1 SpacerItem의 의미
SpacerItem은 레이아웃 안에 넣는 보이지 않는 빈 공간입니다.
버튼 사이, 왼쪽 영역과 오른쪽 영역 사이에 자동으로 늘어나는 여백을 만들고 싶을 때 사용합니다.
SpacerItem
↓
레이아웃 안의 보이지 않는 빈 공간
↓
필요에 따라 늘어나거나 줄어듦
↓
위젯 사이 간격 조절QSpacerItem은 실제 화면에 보이는 버튼이나 라벨은 아닙니다.
하지만 레이아웃 안에서 공간을 차지하므로, 보이지 않는 위젯처럼 빈 영역을 만들어 주는 역할을 합니다.
3.2 예제 코드
import sys
from PySide6.QtWidgets import (
QApplication, QWidget, QPushButton,
QHBoxLayout, QSpacerItem, QSizePolicy
)
class SpacerExample(QWidget):
def __init__(self):
super().__init__()
self.setWindowTitle("SpacerItem 예제")
btn1 = QPushButton("왼쪽 버튼")
btn2 = QPushButton("오른쪽 버튼")
layout = QHBoxLayout(self)
layout.addWidget(btn1)
# 가운데에 늘어나는 빈 공간 추가
spacer = QSpacerItem(40, 20, QSizePolicy.Expanding, QSizePolicy.Minimum)
layout.addItem(spacer)
layout.addWidget(btn2)
if __name__ == "__main__":
app = QApplication(sys.argv)
w = SpacerExample()
w.show()
sys.exit(app.exec())
3.3 코드 구조 이해
핵심 코드는 다음 부분입니다.
spacer = QSpacerItem(40, 20, QSizePolicy.Expanding, QSizePolicy.Minimum)
layout.addItem(spacer)QSpacerItem은 레이아웃에 추가되는 아이템이므로 addWidget()이 아니라 addItem()으로 추가합니다.
| 값 | 의미 |
| 40 | 기본적으로 선호하는 가로 크기입니다. |
| 20 | 기본적으로 선호하는 세로 크기입니다. |
| QSizePolicy.Expanding | 가로 방향으로 가능한 만큼 늘어날 수 있습니다. |
| QSizePolicy.Minimum | 세로 방향은 최소 크기 기준으로 유지합니다. |
3.4 실행 결과 구조
왼쪽 버튼과 오른쪽 버튼 사이에 늘어나는 빈 공간이 들어갑니다.
┌──────────────────────────────────────────────┐
│ [ 왼쪽 버튼 ] [ 오른쪽 버튼 ] │
└──────────────────────────────────────────────┘
가운데 영역 = SpacerItem창을 가로로 넓히면 가운데 빈 공간이 더 넓어집니다.
결과적으로 왼쪽 버튼은 왼쪽에, 오른쪽 버튼은 오른쪽에 붙어 있는 것처럼 보입니다.
중요한 점
SpacerItem은 버튼 사이에 보이지 않는 빈 공간을 넣는 기능입니다.
버튼을 직접 움직이는 것이 아니라, 중간에 늘어나는 공간을 넣어 버튼 사이를 벌리는 방식입니다.
4. SizePolicy 예제
4.1 SizePolicy의 의미
SizePolicy는 위젯이 레이아웃 안에서 가로 방향 또는 세로 방향으로 크기가 변해도 되는지를 알려주는 설정입니다.
쉽게 말하면 위젯이 레이아웃에게 말하는 크기 변경 성향입니다.
SizePolicy
↓
위젯의 크기 변경 성향
↓
가로로 늘어날 수 있는가?
세로로 늘어날 수 있는가?
↓
레이아웃이 위젯을 크기 조정할 때 참고즉, SizePolicy는 위젯이 공간을 받았을 때 실제로 그 공간을 받아들일 준비가 되어 있는지 결정하는 역할을 합니다.
4.2 예제 코드
import sys
from PySide6.QtWidgets import (
QApplication, QWidget, QPushButton,
QVBoxLayout, QSizePolicy
)
class SizePolicyExample(QWidget):
def __init__(self):
super().__init__()
self.setWindowTitle("SizePolicy 예제")
btn = QPushButton("가로는 Expanding / 세로는 Fixed")
# 가로: 확대됨, 세로: 고정
btn.setSizePolicy(QSizePolicy.Expanding, QSizePolicy.Fixed)
layout = QVBoxLayout(self)
layout.addWidget(btn)
if __name__ == "__main__":
app = QApplication(sys.argv)
w = SizePolicyExample()
w.show()
sys.exit(app.exec())
4.3 코드 구조 이해
핵심 코드는 다음 한 줄입니다.
btn.setSizePolicy(QSizePolicy.Expanding, QSizePolicy.Fixed)setSizePolicy()에는 가로 방향 정책과 세로 방향 정책을 전달합니다.
| 방향 | 정책 | 의미 |
| 가로 방향 | QSizePolicy.Expanding | 가능하면 옆으로 넓어져도 좋다는 의미입니다. |
| 세로 방향 | QSizePolicy.Fixed | 세로 높이는 가능한 한 그대로 유지한다는 의미입니다. |
4.4 실행 결과 구조
윈도우를 가로로 키우면 버튼 너비는 늘어납니다.
하지만 버튼 높이는 거의 그대로 유지됩니다.
가로 크기 증가 전
┌────────────────────────────┐
│ [ 가로는 Expanding / 세로는 Fixed ] │
└────────────────────────────┘
가로 크기 증가 후
┌──────────────────────────────────────────────────────┐
│ [ 가로는 Expanding / 세로는 Fixed ] │
└──────────────────────────────────────────────────────┘중요한 점
SizePolicy는 위젯의 크기를 직접 픽셀 단위로 지정하는 기능이 아닙니다.
레이아웃이 공간을 배분할 때, 위젯이 어느 방향으로 커질 수 있는지 알려주는 설정입니다.
5. Stretch, SpacerItem, SizePolicy 비교
5.1 세 기능을 한 문장으로 비교하기
세 기능은 모두 공간과 관련이 있지만, 질문이 다릅니다.
| 기능 | 핵심 질문 | 설명 |
| Stretch | 남는 공간을 누구에게 얼마나 줄까? | 레이아웃 안의 여유 공간을 비율로 나눕니다. |
| SpacerItem | 빈 공간을 어디에 둘까? | 위젯 사이에 보이지 않는 빈 공간을 넣습니다. |
| SizePolicy | 공간을 받았을 때 커져도 될까? | 위젯이 가로/세로로 커질 수 있는지 결정합니다. |
5.2 Stretch와 SizePolicy의 차이
Stretch와 SizePolicy는 특히 헷갈리기 쉽습니다.
둘 다 위젯 크기에 영향을 줄 수 있기 때문입니다.
| 구분 | Stretch Factor | SizePolicy |
| 역할 | 남는 공간 배분 비율 결정 | 위젯의 크기 변경 가능성 결정 |
| 질문 | 얼마나 줄까? | 받아도 될까? |
| 적용 위치 | 레이아웃에 위젯을 추가할 때 | 위젯 자체에 설정 |
| 예시 코드 | layout.addWidget(btn, stretch=2) | btn.setSizePolicy(...) |
Stretch
↓
레이아웃이 남는 공간을 어떤 비율로 나눌지 결정
SizePolicy
↓
위젯이 그 공간을 받아서 커질 수 있는지 결정정리
Stretch는 “남는 공간을 누구에게 얼마나 줄까?”를 결정합니다.
SizePolicy는 “공간을 받았을 때, 나는 커질 준비가 되어 있나?”를 결정합니다.
6. Qt Qt Designer에서 확인하기
6.1 Spacer와 SizePolicy는 Designer에서도 확인 가능
Qt Designer에서도 Spacer와 SizePolicy 개념을 확인할 수 있습니다.
폼 화면을 만들 때 Horizontal Spacer 또는 Vertical Spacer를 배치하면, 보이지 않는 빈 공간을 레이아웃 안에 넣을 수 있습니다.
| Designer에서 보는 항목 | 코드 관점 |
| Horizontal Spacer | QSpacerItem을 가로 방향으로 배치한 것과 비슷합니다. |
| Vertical Spacer | QSpacerItem을 세로 방향으로 배치한 것과 비슷합니다. |
| sizePolicy | 위젯의 가로/세로 크기 변경 정책을 설정합니다. |
6.2 실습에서 확인할 흐름
Qt Designer에서는 다음 순서로 확인하면 좋습니다.
1. 버튼 두 개를 폼 위에 배치한다.
2. 두 버튼 사이에 Horizontal Spacer를 넣는다.
3. 폼 전체에 Lay Out Horizontally를 적용한다.
→ 버튼 사이의 빈 공간이 자동으로 늘어나는지 확인한다.
4. 버튼을 선택한다.
5. Property Editor에서 sizePolicy를 확인한다.
→ Horizontal Policy와 Vertical Policy를 확인한다.Stretch Factor는 코드에서 직접 지정하는 경우가 더 직관적이고, SpacerItem과 SizePolicy는 Designer에서도 비교적 쉽게 확인할 수 있습니다.
이번 단계의 핵심
Qt Designer에서 Spacer는 보이지 않는 빈 공간으로, SizePolicy는 위젯의 크기 변경 정책으로 확인할 수 있습니다.
코드에서 배운 개념과 Designer의 속성을 연결해서 보는 것이 중요합니다.
7. 정리
이번 단계에서는 PySide6 레이아웃에서 자주 사용하는 Stretch Factor, SpacerItem, SizePolicy를 살펴보았습니다.
이 세 기능은 모두 창 크기 변화와 남는 공간 처리에 영향을 줍니다.
레이아웃에 위젯 배치
↓
창 크기 변경
↓
남는 공간 발생
↓
Stretch / SpacerItem / SizePolicy 기준으로 공간 처리
↓
위젯 크기와 간격이 자동 조정됨| 기능 | 정리 |
| Stretch Factor | 레이아웃 안의 남는 공간을 위젯들에게 비율로 나눠줍니다. |
| SpacerItem | 레이아웃 안에 보이지 않는 빈 공간을 넣습니다. |
| SizePolicy | 위젯이 가로 또는 세로 방향으로 커질 수 있는지 결정합니다. |
| addWidget(..., stretch=값) | 위젯을 레이아웃에 추가하면서 stretch 비율을 지정합니다. |
| QSpacerItem | 빈 공간도 레이아웃 안에서 하나의 아이템처럼 작동하게 만듭니다. |
| setSizePolicy() | 위젯의 가로/세로 크기 변경 정책을 설정합니다. |
이번 단계에서 기억할 문장
Stretch는 공간 배분 비율, SpacerItem은 빈 공간, SizePolicy는 위젯의 크기 변경 성향입니다.
레이아웃을 잘 다루려면 위젯을 배치하는 것뿐만 아니라, 남는 공간이 어떻게 처리되는지도 이해해야 합니다.
참고. 공식 문서로 확인하기
이번 예제에서 사용한 QBoxLayout, QSpacerItem, QSizePolicy, Layout Management는 Qt for Python 공식 문서에서 확인할 수 있습니다.
특히 이번 단계에서 중요한 부분은 레이아웃이 남는 공간을 어떻게 배분하고, 위젯이 그 공간을 어떻게 받아들이는지입니다.
1. 공식 문서 참고 표
| 구분 | 공식 문서 | 확인할 내용 |
| QBoxLayout | PySide6.QtWidgets.QBoxLayout | addWidget()에서 stretch factor를 지정할 수 있고, addStretch(), addSpacing(), addLayout() 같은 기능을 확인할 수 있습니다. |
| QSpacerItem | PySide6.QtWidgets.QSpacerItem | 레이아웃 안에 빈 공간을 제공하는 아이템을 확인할 수 있습니다. |
| QSizePolicy | PySide6.QtWidgets.QSizePolicy | 위젯이 가로/세로 방향으로 크기 변경을 얼마나 허용하는지 설명하는 정책을 확인할 수 있습니다. |
| Layout Management | Qt for Python - Layout Management | 레이아웃이 위젯의 sizeHint와 sizePolicy를 참고해 사용 가능한 공간을 배분하는 구조를 확인할 수 있습니다. |
| QtWidgets Layouts | Qt for Python - QtWidgets Layouts | 레이아웃이 자식 위젯을 자동으로 정렬하고, 위젯의 크기 요구사항을 참고한다는 점을 확인할 수 있습니다. |
2. 공식 문서와 개념 연결
공식 문서 기준으로 보면, 레이아웃은 단순히 위젯을 나열하는 도구가 아니라 사용 가능한 공간을 계산하고 배분하는 구조입니다.
따라서 Stretch Factor, SpacerItem, SizePolicy는 모두 레이아웃이 공간을 처리하는 방식과 연결됩니다.
레이아웃
↓
사용 가능한 공간 계산
↓
위젯의 sizeHint / sizePolicy 확인
↓
stretch / spacer 기준으로 남는 공간 처리
↓
위젯 위치와 크기 자동 조정
3. 이번 예제와 공식 문서 연결
| 이번 예제 코드 | 공식 문서와 연결되는 의미 |
| layout.addWidget(btn2, stretch=2) | QBoxLayout에 위젯을 추가하면서 stretch factor를 설정합니다. |
| QSpacerItem(40, 20, QSizePolicy.Expanding, QSizePolicy.Minimum) | 기본 크기와 가로/세로 size policy를 가진 빈 공간 아이템을 생성합니다. |
| layout.addItem(spacer) | 레이아웃 안에 QSpacerItem을 추가하여 빈 공간을 배치합니다. |
| btn.setSizePolicy(QSizePolicy.Expanding, QSizePolicy.Fixed) | 버튼이 가로로는 늘어나고 세로로는 고정되는 성향을 갖도록 설정합니다. |
4. 정리 흐름도
공식 문서 기준으로 정리하면 다음과 같습니다.
QLayout
↓
위젯의 크기 요구사항 확인
↓
SizePolicy로 위젯의 크기 변경 성향 확인
↓
Stretch Factor로 남는 공간 배분
↓
SpacerItem으로 빈 공간 생성
↓
창 크기 변화에 맞춰 UI 자동 조정즉, 주요 레이아웃 기능은 화면을 더 자연스럽고 유연하게 반응하도록 만드는 도구입니다.