次の手順では、GcTableLayoutContainer コントロールの行と列の設定を行い、コントロールのリサイズにあわせてセルをどのように動作させるかを設定します。

1. Visual Studio を起動して、新規に Windows フォーム アプリケーション プロジェクトを作成する。
2. Form1 の Size プロパティに (650, 500)、MinimumSize プロパティに (450, 400) を設定する。
3. ツールボックスから「GcTableLayoutContainer」を選択し、Form1 にドラッグ＆ドロップする。
4. 「テイブルレイアウトのパターン」ダイアログが表示されるので、［Default］を選択する。
5. GcTableLayoutContainer1 のスマートタグから[親コンテナにドッキングする]を選択する。
6. GcTableLayoutContainer1 のスマートタグから[行の追加]を選択して行を1つ追加する。
   
7. １列目の２、３行目を選択しし、ツールバーの[セルのマージ]をクリックする。
   
8. １行目の行ヘッダをクリックし、ツールバーの[セルのマージ]をクリックする。
   
9. ２行目の行ヘッダをクリックし、ツールバーの[実行時に列幅の変更を許可する]をクリックする。
   
10. 行ヘッダのコンテキスト メニュー（右クリックメニュー）から［行の編集...］を選択し、TableRow コレクションエディターを表示する。
11. TableRow コレクションエディターで以下の値を設定し、[OK] ボタンを押下する。
    

    メンバー	SizeType プロパティ	Height プロパティ	MaxHeight プロパティ	MinHeight プロパティ
    tableRow1	Absolute	30	0	0
    tableRow2	Percent	35	160	0
    tableRow3	Percent	65	0	180

12. 列ヘッダのコンテキスト メニュー（右クリックメニュー）から［列の編集...］を選択し、TableColumn コレクションエディターを表示する。
13. TableColumn コレクションエディターで以下の値を設定し、[OK] ボタンを押下する。
    

    メンバー	SizeType プロパティ	Width プロパティ	MaxWidth プロパティ	MinWidth プロパティ
    tableColumn1	Percent	30	240	150
    tableColumn2	Percent	70	0	0

以上で、基本的なレイアウトが作成できました。

次のステップでは、GcTableLayoutContainer コントロールのセルに Visual Studio 標準のコントロールを配置します。

上記で作成したレイアウトに Visual Studio 標準のコントロールを配置します。以下の手順では、それぞれのセルを下図の名称を使用して説明します。

1. ツールボックスから「MenuStrip」を選択し、「セルA」にドラッグ＆ドロップする。
2. MenuStrip1 のメニュー項目に任意の文字を設定する。
   
3. ツールボックスから「TreeView」を選択し、「セルB」にドラッグ＆ドロップする。
4. TreeView1 コントロールのスマートタグから[親コンテナにドッキングする]を選択する。
5. TreeView1 コントロールのスマートタグから[ノードの編集...]を選択し、TreeNode エディターを表示する。
6. TreeNode エディターを使用して、任意の項目を追加する。
   
7. ツールボックスから「FlowLayoutPanel」を選択し、「セルC」にドラッグ＆ドロップする。
8. FlowLayoutPanel1 のスマートタグから[親コンテナにドッキングする]を選択する。
9. FlowLayoutPanel1 を選択し、AutoScroll プロパティに True を設定する。
10. FlowLayoutPanel1 を選択し、BackColor プロパティに White を設定する。
11. ツールボックスから「Panel」を選択し、FlowLayoutPanel1 の上にドラッグ＆ドロップする。
12. 再度、ツールボックスから「Panel」を選択し、FlowLayoutPanel1 の上にドラッグ＆ドロップする。
13. Panel1、Panel2 の Size プロパティに (200, 135) を設定する。
    
14. ツールボックスから「TextBox」を選択し、Panel1 の上にドラッグ＆ドロップする。 この操作を繰り返して Panel1、Panel2 に TextBox を４個ずつ配置する。
    
15. ツールボックスから「DataGridView」を選択し、「セルD」にドラッグ＆ドロップする。
16. DataGridView1 のスマートタグから[親コンテナにドッキングする]を選択する。
    
17. DataGridView1 のスマートタグから[列の追加...]を選択し、「列の追加」ダイアログを表示する。
18. 「列の追加」ダイアログの[追加]ボタンを押下して列を追加する。この操作を繰り返して DataGridView1 に５列を追加する。
    

プロジェクトを実行し、フォームのリサイズを行うと、それぞれのセルがフォームのサイズにあわせて拡大／縮小します。また、セルCとセルDの境界線はマウスでドラッグすることができます。