方法: Windows フォームでマルチペイン ユーザー インターフェイスを作成する

  • [アーティクル]

フォーム上にコントロールを配置すると、Microsoft Outlook で使用されているものと同様のマルチペイン ユーザー インターフェイス ([フォルダー] リスト、[メッセージ] ペイン、[プレビュー] ペインが含まれている) を作成することができます。 この配置は、主にフォームを使用してコントロールをドッキングさせることで実現できます。

コントロールをドッキングする場合は、コントロールを親コンテナーのどの端に固定するかを決定します。 Dock プロパティを Right に設定すると、コントロールの右端が親コントロールの右端にドッキングされます。 また、ドッキングされたコントロールの端は、コンテナー コントロールのそれに合わせてサイズ変更されます。 Dock プロパティの動作の詳細については、「方法: Windows フォームにコントロールをドッキングする」を参照してください。

この手順では、アプリケーションを Microsoft Outlook に似せる機能を追加するのではなく、SplitContainer とその他のコントロールをフォーム上に配置する方法に焦点を当てています。

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

このユーザー インターフェイスを作成するには、SplitContainer コントロール内にすべてのコントロールを配置します。 SplitContainer には、左側のパネルの TreeView コントロールと、右側のパネルにある別の SplitContainer が含まれています。 2 つ目の SplitContainer には、上部の ListView コントロールと、下部の RichTextBox コントロールが含まれています。

これらの SplitContainer コントロールでは、フォーム上の他のコントロールのサイズを個別に変更できます。 この手順の手法を調整して、独自のカスタム ユーザー インターフェイスを作成することもできます。

コントロールのレイアウト

次の表では、Microsoft Outlook と似せるようにコントロールを構成する方法について説明します。

コントロール プロパティ 値
SplitContainer 名前 splitContainer1
Dock Fill
TabIndex 4
SplitterWidth 4
SplitterDistance 100
Panel1.Controls このパネルに treeView1 コントロールを追加します。
Panel2.Controls このパネルに splitContainer2 コントロールを追加します。
TreeView 名前 treeView1
Dock Fill
TabIndex 0
Nodes Node0 という名前の新しいノードを追加します
SplitContainer 名前 splitContainer2
Dock Fill
TabIndex 1
SplitterWidth 4
SplitterDistance 150
方向 Horizontal
Panel1.Controls このパネルに listView1 コントロールを追加します。
Panel2.Controls このパネルに richTextBox1 コントロールを追加します。
ListView 名前 listView1
Dock Fill
TabIndex 2
項目 新しい項目を追加し、テキストを item1 に設定します。
RichTextBox 名前 richTextBox1
Dock Fill
TabIndex 3
Text richTextBox1

関連項目