会 WPF + WinForms，现在转 Qt，其实是降维迁移。
🔥「WPF → Qt 快速对照速成图 + 思维迁移指南」
一、先给你结论
Qt 的布局思想 ≈ WPF
Qt 的 API 风格 ≈ C++ 版 WinForms
Qt 的渲染架构 ≈ WPF + 跨平台抽象
二、Qt 是什么？
Qt
- 跨平台 UI 框架
- C++ 为主
- 布局系统 + 逻辑像素
- 默认 DPI 友好
三、布局容器对照表（核心）
| WPF | Qt | 作用 |
|---|---|---|
| Grid | QGridLayout | 网格布局 |
| StackPanel (Vertical) | QVBoxLayout | 垂直堆叠 |
| StackPanel (Horizontal) | QHBoxLayout | 水平堆叠 |
| DockPanel | QDockWidget + QMainWindow | 停靠布局 |
| Canvas | 无直接等价 | 绝对定位 |
| WrapPanel | QFlowLayout（自定义） | 流式布局 |
| UniformGrid | QGridLayout + stretch | 均匀网格 |
四、逐个详细讲解
1️⃣ StackPanel ⇄ QVBoxLayout / QHBoxLayout
WPF
<StackPanel Orientation="Vertical"><Button Content="A"/><Button Content="B"/>
</StackPanel>
Qt
QVBoxLayout* layout = new QVBoxLayout();QPushButton* btn1 = new QPushButton("A");
QPushButton* btn2 = new QPushButton("B");layout->addWidget(btn1);
layout->addWidget(btn2);setLayout(layout);
对应属性
| WPF | Qt |
|---|---|
| Margin | setContentsMargins() |
| HorizontalAlignment | setAlignment() |
| VerticalAlignment | setAlignment() |
| Spacing | setSpacing() |
示例：
layout->setSpacing(10);
layout->setContentsMargins(10,10,10,10);
2️⃣ Grid ⇄ QGridLayout
WPF
<Grid><Grid.RowDefinitions><RowDefinition Height="*"/><RowDefinition Height="Auto"/></Grid.RowDefinitions><Button Grid.Row="0"/>
</Grid>
Qt
QGridLayout* layout = new QGridLayout();layout->addWidget(btn1, 0, 0);
layout->addWidget(btn2, 1, 0);layout->setRowStretch(0, 1); // *
layout->setRowStretch(1, 0); // Auto
Stretch 对应关系
| WPF | Qt |
|---|---|
| Height="*" | setRowStretch(1) |
| Auto | 默认 sizeHint |
| 固定值 | setRowMinimumHeight |
3️⃣ DockPanel ⇄ QMainWindow + QDockWidget
Qt 的 Dock 是完整窗口级 Dock。
WPF
<DockPanel><Button DockPanel.Dock="Top"/>
</DockPanel>
Qt
QMainWindow* mainWindow = new QMainWindow();QDockWidget* dock = new QDockWidget("Tool", mainWindow);
mainWindow->addDockWidget(Qt::LeftDockWidgetArea, dock);
Qt 的 Dock 比 WPF 强大很多。
4️⃣ Alignment 对照
WPF
<Button HorizontalAlignment="Center"/>
Qt
layout->setAlignment(btn, Qt::AlignCenter);
Qt 使用位标志：
Qt::AlignLeft
Qt::AlignRight
Qt::AlignCenter
Qt::AlignTop
Qt::AlignBottom
五、尺寸策略（这是重点）
WPF：
Width="Auto"
Width="200"
Width="*"
Qt 用：
QSizePolicy
btn->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Preferred);
Qt SizePolicy 对照
| WPF | Qt |
|---|---|
| Auto | Preferred |
| 固定宽度 | Fixed |
| * | Expanding |
| MinWidth | setMinimumWidth |
| MaxWidth | setMaximumWidth |
常用组合
QSizePolicy::Fixed
QSizePolicy::Minimum
QSizePolicy::Maximum
QSizePolicy::Preferred
QSizePolicy::Expanding
QSizePolicy::MinimumExpanding
🔥 这是 Qt 布局核心。
六、Qt 布局算法 ≈ WPF Measure/Arrange
WPF：
Measure
Arrange
Render
Qt：
sizeHint()
minimumSizeHint()
layout calculation
setGeometry()
paintEvent()
Qt 的 sizeHint 相当于 WPF 的 DesiredSize。
七、Margin / Padding 对应
WPF
<Button Margin="10"/>
Qt
layout->setContentsMargins(10,10,10,10);
Qt 控件本身没有 Margin，只有 Layout 管理 Margin。
八、DPI 对应
Qt 默认支持高 DPI：
QApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
Qt 内部使用逻辑像素。
类似 WPF DIP。
九、Qt 和 WPF 的思维差异
| 维度 | WPF | Qt |
|---|---|---|
| 声明方式 | XAML | 代码或 .ui |
| 数据绑定 | 强 | 较弱 |
| MVVM | 内建生态 | 需要自己搭 |
| 信号机制 | RoutedEvent | signal/slot |
| 动画 | Storyboard | QPropertyAnimation |
十、Qt 信号槽 vs WPF 事件
WPF：
button.Click += OnClick;
Qt：
connect(button, &QPushButton::clicked, this, &MainWindow::onClick);
十一、快速学习路线
因为你会 WPF，我建议：
第一步：纯布局迁移
练习：
- QVBoxLayout
- QHBoxLayout
- QGridLayout
- QSizePolicy
做到：
不查文档写布局
第二步：信号槽机制
理解：
- 信号
- 槽
- lambda 连接
第三步：模型视图
学习：
- QAbstractItemModel
- QTableView
- MVC
这类似 WPF 的 ItemsControl。
第四步：绘图
- QPainter
- QWidget::paintEvent
- QOpenGLWidget
十二、终极认知迁移图
WPF 思维↓
逻辑单位↓
布局驱动↓
数据驱动Qt 思维↓
Layout + SizePolicy↓
signal/slot↓
QPainter
十三、给你一句加速建议
因为你已经懂：
- 布局系统
- DPI
- 逻辑单位
Qt 最大门槛只剩：
QSizePolicy + 信号槽
其他都是迁移。