Qt 的 .ui (XML) 文件和 WPF 的 .xaml (XML) 文件

理解了 UI 定义文件的本质，你就掌握了现代 GUI 开发的“通关密码”。

WinForm 的界面代码通常混在 .Designer.cs（C# 代码）里，而 Qt 和 WPF 都采用了“界面与逻辑分离”的思想，使用 XML 格式来描述布局。

---

1. 这种“分离”有什么好处？

想象你在盖房子：

• WinForm：一边砌砖一边装水管（代码和布局混在一起），想改窗口大小可能要改几十行坐标代码。
• Qt / WPF：先画好图纸（.ui 或 .xaml），房子（程序）盖好后，哪怕换个大门（换个皮肤或分辨率），图纸里的比例会自动调整，不需要重写水管逻辑。

---

2. 直观对比：Qt (.ui) vs WPF (.xaml)

假设我们要实现一个简单的布局：一个垂直排列的容器，里面有一个输入框和一个按钮。

Qt 的 .ui 文件 (XML 格式)

Qt 使用 ui 文件，它本质上是标准的 XML。当你使用 Qt Designer 拖拽布局时，它在后台生成这样的结构：

<layout class="QVBoxLayout" name="verticalLayout"><item><widget class="QLineEdit" name="lineEditName"><property name="placeholderText"><string>请输入姓名</string></property></widget></item><item><widget class="QPushButton" name="pushButtonOK"><property name="text"><string>确定</string></property></widget></item>
</layout>

• 特点：结构严谨，通过 <layout> 标签强制约束子控件。你不需要写坐标，QVBoxLayout 会自动计算。

WPF 的 .xaml 文件 (声明式语法)

WPF 使用 XAML，语法更接近 HTML，非常灵活：

<StackPanel Orientation="Vertical"><TextBox x:Name="lineEditName" Margin="5" Tag="请输入姓名"/><Button x:Name="pushButtonOK" Content="确定" Margin="5"/>
</StackPanel>

• 特点：非常简洁。StackPanel 就像一个磁铁，把里面的控件一个接一个地吸在一起。

---

3. 如何在 Qt Creator 中实现“永不乱”的布局？（保姆级步骤）

既然你刚开始学，我带你手动操作一次最稳健的“自适应布局”流程：

第一步：放置控件

不要管位置，把 QLineEdit 和 QPushButton 随便丢进窗体里。

第二步：设置“顶级布局” (关键点！)

这是很多初学者漏掉的一步。

1. 不要点击控件。
2. 点击窗体空白处（选中 MainWindow 本身）。
3. 看工具栏上方，点击那个“垂直布局” (Vertical Layout) 图标。

• 魔法发生了：控件会瞬间自动拉伸，填满整个窗口！

第三步：调整间距 (Spacers)

如果你觉得按钮太长了，想让它只占一点点位置：

1. 从左侧侧边栏拖一个 Vertical Spacer (垂直弹簧) 到按钮下面。
2. 结果：弹簧会把按钮“推”到最上面，按钮就不再疯狂拉伸了。

---

4. 总结：给 WinForm 转向 Qt 的你的 3 条金律

1. 永远不要看 Geometry 属性：在 WinForm 里你习惯看 Location 和 Size。在 Qt 里，一旦你用了 Layout，这两个属性就失效了（变灰），这说明你做对了！
2. 属性名对照表：

• WinForm Text $\rightarrow$ Qt text (Label/Button) 或 placeholderText (输入框水印)。
• WinForm Name $\rightarrow$ Qt objectName (这是你在代码里调用它的唯一标识)。
• WinForm Enabled $\rightarrow$ Qt enabled (小写)。

3. 多用预览 (Ctrl + R)：在设计器里按 Ctrl + R 可以直接预览窗口缩放的效果。如果缩放时控件不动，说明你没设置“顶级布局”。

---