Qt 레이아웃 시스템 완벽 가이드: WPF 개발자를 위한 핵심 비교

Qt는 WPF 및 WinForms 개발자에게 매우 흥미로운 선택지입니다. 이 글에서는 Qt 레이아웃 시스템의 핵심 개념을 다루며, WPF 경험이 있는 개발자들이 어떻게 Qt로 빠르게 전환할 수 있는지에 초점을 맞춥니다.

Qt의 핵심 아키텍처

Qt는 크로스 플랫폼 UI 프레임워크로 C++를 기반으로 하며, 강력한 레이아웃 시스템과 논리적 픽셀 단위를 제공합니다. 기본적으로 DPI 인식 기능을 내장하고 있어 고해상도 디스플레이에서도 일관된 사용자 경험을 보장합니다.

주요 레이아웃 컨테이너 비교

WPF 요소 Qt 대응 컴포넌트 주요 기능
Grid QGridLayout 2차원 그리드 기반 레이아웃
StackPanel (수직) QVBoxLayout 위에서 아래로 요소 배치
StackPanel (수평) QHBoxLayout 왼쪽에서 오른쪽으로 요소 배치
DockPanel QMainWindow + QDockWidget 도킹 가능한 패널
Canvas QWidget + 수동 위치 지정 절대 위치 기반 배치
WrapPanel 사용자 정의 QFlowLayout 여러 줄에 걸쳐 요소 배치
UniformGrid QGridLayout + stretch 균일한 크기의 그리드

세부 레이아웃 구현 방법

  1. 수직/수평 레이아웃: QVBoxLayout/QHBoxLayout

WPF에서 StackPanel은 다음과 같이 구현됩니다:

<StackPanel Orientation="Vertical">
    <Button Content="A"/>
    <Button Content="B"/>
</StackPanel>

Qt에서는 코드 기반으로 다음과 같이 구현합니다:

// 수직 레이아웃 생성
VerticalLayout* mainLayout = new VerticalLayout(parentWidget);

// 버튼 생성 및 추가
ButtonElement* firstBtn = new ButtonElement("A", mainLayout);
ButtonElement* secondBtn = new ButtonElement("B", mainLayout);

// 레이아웃 설정
mainLayout->setSpacing(10);
mainLayout->setPadding(10, 10, 10, 10);

속성 매핑 표:

WPF 속성 Qt 메서드
Margin setPadding()
HorizontalAlignment setAlignment()
VerticalAlignment setAlignment()
Spacing setSpacing()
  1. 그리드 레이아웃: QGridLayout

WPF Grid 예시:

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>
    <Button Grid.Row="0"/>
</Grid>

Qt에서의 구현:

// 그리드 레이아웃 생성
GridPanel* gridLayout = new GridPanel(container);

// 버튼 추가 및 위치 지정
ControlElement* btn = new ControlElement(gridLayout);
gridLayout->addWidget(btn, 0, 0); // 행 0, 열 0

// 행 확장성 설정
gridLayout->setRowStretchFactor(0, 1); // '*'에 해당
gridLayout->setRowStretchFactor(1, 0); // 'Auto'에 해당

확장성 매핑:

WPF 값 Qt 메서드
Height="*" setRowStretchFactor(row, 1)
Auto 기본 sizeHint() 사용
고정 값 setRowMinimumHeight()
  1. 도킹 레이아웃: QMainWindow + QDockWidget

WPF DockPanel:

<DockPanel>
    <Button DockPanel.Dock="Top"/>
</DockPanel>

Qt 구현:

// 메인 윈도우 생성
MainWindow* mainWin = new MainWindow();

// 도킹 위젯 생성 및 추가
DockingPanel* toolPanel = new DockingPanel("도구", mainWin);
mainWin->attachDockWidget(DockPosition::Left, toolPanel);

Qt의 도킹 시스템은 WPF보다 더 강력한 기능을 제공합니다.

  1. 정렬 방법: Alignment

WPF 정렬:

<Button HorizontalAlignment="Center"/>

Qt 정렬:

layout->setAlignment(button, AlignmentFlag::Center);

Qt는 비트 플래그를 사용한 정렬을 지원합니다:

AlignmentFlag::Left
AlignmentFlag::Right
AlignmentFlag::Center
AlignmentFlag::Top
AlignmentFlag::Bottom

크기 정책: SizePolicy

WPF 크기 설정:

Width="Auto"
Width="200"
Width="*"

Qt에서는 QSizePolicy를 사용합니다:

button->setSizePolicy(SizePolicy::Expanding, SizePolicy::Preferred);

크기 정책 매핑:

WPF 값 Qt 값
Auto Preferred
고정 너비 Fixed
* Expanding
최소 너비 setMinimumWidth()
최대 너비 setMaximumWidth()

일반적으로 사용되는 조합:

SizePolicy::Fixed
SizePolicy::Minimum
SizePolicy::Maximum
SizePolicy::Preferred
SizePolicy::Expanding
SizePolicy::MinimumExpanding

Qt 레이아웃 알고리즘

WPF의 레이아웃 과정:

Measure
Arrange
Render

Qt의 레이아웃 과정:

sizeHint()
minimumSizeHint()
layout 계산
setGeometry()
paintEvent()

Qt의 sizeHint()는 WPF의 DesiredSize와 유사합니다.

여백(Margin/Padding) 처리

WPF:

<Button Margin="10"/>

Qt:

layout->setPadding(10, 10, 10, 10);

Qt 컨트롤 자체에 여백 속성이 없으며, 레이아웃이 여백을 관리합니다.

DPI 처리 방식

Qt는 기본적으로 고 DPI를 지원합니다:

Application::enableHighDpiScaling();

Qt는 내부적으로 논리적 픽셀을 사용하며, 이는 WPF의 DIP와 유사합니다.

WPF와 Qt의 주요 차이점

구분점 WPF Qt
선언 방식 XAML 코드 또는 .ui 파일
데이터 바인딩 강력한 지원 제한적 지원
MVVM 패턴 내장된 생태계 수동 구성 필요
이벤트 메커니즘 RoutedEvent 시그널/슬롯
애니메이션 Storyboard QPropertyAnimation

시그널/슬롯 vs WPF 이벤트

WPF 이벤트 처리:

button.Click += OnButtonClick;

Qt 시그널/슬롯:

connect(button, &ButtonElement::clicked, this, &MainWindow::handleButton);

Qt 학습 로드맵

1단계: 레이아웃 마스터링

  • QVBoxLayout, QHBoxLayout, QGridLayout
  • QSizePolicy 이해 및 활용
  • 문서를 보지 않고도 레이아웃 구현 가능해야 함

2단계: 시그널/슬롯 메커니즘

  • 시그널 개념 이해
  • 슬롯 함수 구현
  • 람다를 이용한 연결 방법

3단계: 모델/뷰 아키텍처

  • AbstractModel 상속받은 모델 구현
  • TableView 활용
  • MVC 패턴 적용 (WPF의 ItemsControl과 유사)

4단계: 그래픽스 프로그래밍

  • QPainter 사용법
  • Widget의 paintEvent 오버라이딩
  • OpenGL 위젯 활용

핵심 전환 포인트

WPF 개발자가 Qt로 전환할 때 가장 중요한 개념은 다음과 같습니다:

  1. 레이아웃 시스템 이해
  2. QSizePolicy 활용 방법
  3. 시그널/슬롯 메커니즘 숙지

이 세 가지를 익히면 나머지 개념들은 기존 WPF 지식을 통해 쉽게 확장할 수 있습니다.

태그: Qt C++ GUI 레이아웃 WPF

6월 29일 02:33에 게시됨