syncfusion-winforms-grid-layout

Windows Forms での GridLayout の実装

GridLayout は、子コントロールを行と列で構成されるグリッド構造に自動的に配置するレイアウトマネージャーです。複数のコントロールを、間隔を正確に調整しながら規則的なグリッド形式で配置する必要がある場合に、このスキルを使用してください。

このスキルを使用する場面

• 子コントロールをグリッドベースのレイアウトに配置する
• 行と列を均一に構成する
• コントロール間の水平方向および垂直方向の間隔を調整する
• コントロールをレイアウトに動的に含める、または除外する
• コードまたはデザイナーを使ってコントロールを配置する

コンポーネントの概要

GridLayout が提供する機能：

• グリッド構造：行と列への自動配置
• 間隔の調整：水平方向（HGap）および垂直方向（VGap）の間隔を設定
• コントロールの参加：コントロールをレイアウト管理に含める、または除外する
• 動的な設定：行と列をプログラムから設定可能

ドキュメントとナビゲーションガイド

はじめに

📄 参照： references/getting-started.md

• アセンブリの配置と NuGet のセットアップ
• デザイナーまたはコードを使った GridLayout の作成
• レイアウトへの子コントロールの追加
• 基本的な実装パターン

行と列の設定

📄 参照： references/rows-and-columns-configuration.md

• 行数と列数の設定
• Rows プロパティの優先順位について
• 子コントロール数に基づく自動サイズ調整の動作
• グリッドの分割方法

間隔とギャップ

📄 参照： references/spacing-and-gaps.md

• 水平方向の間隔（HGap）の設定
• 垂直方向の間隔（VGap）の設定
• 間隔の計算とその影響
• 一般的な間隔のパターン

子コントロールの管理

📄 参照： references/managing-child-controls.md

• ParticipateInLayout プロパティの概要
• コントロールをレイアウトに追加または削除する
• コントロールがレイアウトに参加しているか確認する
• デザイン時にコントロールを並べ替える

クイックスタートの例

using Syncfusion.Windows.Forms.Tools;

// Create GridLayout instance
GridLayout gridLayout1 = new GridLayout();
gridLayout1.ContainerControl = this;

// Configure grid structure
gridLayout1.Rows = 2;
gridLayout1.Columns = 2;

// Set spacing
gridLayout1.HGap = 10;
gridLayout1.VGap = 10;

// Add child controls
ButtonAdv button1 = new ButtonAdv() { Text = "Button 1" };
ButtonAdv button2 = new ButtonAdv() { Text = "Button 2" };

this.Controls.Add(button1);
this.Controls.Add(button2);

// Include controls in layout
gridLayout1.SetParticipateInLayout(button1, true);
gridLayout1.SetParticipateInLayout(button2, true);

主な設定プロパティ

プロパティ	型	目的
Rows	int	グリッドの行数を指定します（設定すると列数が決まります）
Columns	int	列数を指定します（Rows が null または負の値の場合に使用されます）
HGap	int	コントロール間およびレイアウトの境界との水平方向の間隔
VGap	int	コントロール間およびレイアウトの境界との垂直方向の間隔
ContainerControl	Control	レイアウトマネージャーを保持するフォームまたはコンテナー

一般的なパターン

パターン 1：単一列のレイアウト

gridLayout1.Rows = null;  // Let rows auto-calculate
gridLayout1.Columns = 1;

コントロールを縦方向に積み重ねる場合に便利です。

パターン 2：均等な間隔のグリッド

gridLayout1.Rows = 3;
gridLayout1.Columns = 3;
gridLayout1.HGap = 5;
gridLayout1.VGap = 5;

5 ピクセルの間隔を持つ 3x3 グリッドを作成します。

パターン 3：条件付きのコントロール表示

// Hide a control from layout without removing it
gridLayout1.SetParticipateInLayout(controlToHide, false);

コントロールを削除せずに、レイアウトを動的に調整できます。