如何:用 Windows 窗体创建多窗格用户界面

通过在窗格上对控件进行排列,可创建一个类似于 Microsoft Outlook 中使用的多窗格用户界面,其中包含一个“文件夹”列表、一个“消息”窗格和一个“预览”窗格。 这种排列主要通过将控件停靠在窗体上来实现。

停靠控件时,可确定控件固定到父容器的哪个边缘。 如果将 Dock 属性设置为 Right,则控件的右边缘将停靠在其父控件的右边缘。 此外,调整控件的停靠边缘的大小以匹配其容器控件的大小。 有关 Dock 属性如何工作的详细信息,请参阅如何:在 Windows 窗体上停靠控件

此过程侧重于对 SplitContainer 和表单上的其他控件进行排列,而不是添加功能以使应用程序模拟 Microsoft Outlook。

A form that's designed to look like an Outlook mail window.

若要创建此用户界面,请将所有控件置于 SplitContainer 控件中。 SplitContainer 在左侧面板中包含一个 TreeView 控件,在右侧面板中包含另一个 SplitContainer。 第二个 SplitContainer 在顶部包含一个 ListView 控件,在底部包含一个 RichTextBox 控件。

这些 SplitContainer 控件可实现窗体上其他控件的独立大小调整。 你可以调整此过程中的技术来制作自己的自定义用户界面。

控件布局

下表介绍了如何配置控件以模拟 Microsoft Outlook:

控制 属性 Value
SplitContainer 名称 splitContainer1
靠接 Fill
TabIndex 4
SplitterWidth 4
SplitterDistance 100
Panel1.Controls treeView1 控件添加到此面板。
Panel2.Controls splitContainer2 控件添加到此面板。
TreeView 名称 treeView1
靠接 Fill
TabIndex 0
Nodes 添加一个名为 Node0 的新节点
SplitContainer 名称 splitContainer2
靠接 Fill
TabIndex 1
SplitterWidth 4
SplitterDistance 150
方向 Horizontal
Panel1.Controls listView1 控件添加到此面板。
Panel2.Controls richTextBox1 控件添加到此面板。
ListView 名称 listView1
靠接 Fill
TabIndex 2
添加一个新项并将文本设置为 item1
RichTextBox 名称 richTextBox1
靠接 Fill
TabIndex 3
文本 richTextBox1

另请参阅