WPFコントロール：Grid（グリッド配置・表形式 ）

Gridは、格子状のレイアウトを定義し、その上にコントロールを配置するためのパネルです。

WPFのコントロールは基本的に幅や高さ、座標を明示的に指定せず、自動レイアウトに任せて配置します。

このとき配置の基準となるのは親コントロールの領域ですが、Gridでは行（Row）と列（Column）を定義することで、任意のサイズの領域を分割してレイアウトを構成することができます。

そのため、WPFのレイアウトにおいてGridは使用頻度の高い、非常に重要なコントロールの一つです。

2×2のGridの例

XAML

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <Button Grid.Column="0" Grid.Row="0"
        Content="左上"
        Margin="16" />
    <Button Grid.Column="0" Grid.Row="1"
        Content="左下"
        Padding="8"
        Margin="16" />
    <Button Grid.Column="1" Grid.Row="0"
        Content="右上"
        Margin="16" />
    <Button Grid.Column="1" Grid.Row="1"
        Content="右下"
        Margin="16" />
</Grid>

Columnの設定

<Grid.ColumnDefinitions> 
    <ColumnDefinition Width="*"/> 
    <ColumnDefinition Width="*"/> 
</Grid.ColumnDefinitions>

ColumnDefinitions を定義すると、その数だけ横方向に領域（カラム）が作成されます。
上記のサンプルでは、2つのカラムが作成されます。

Width プロパティでカラムの幅を指定します。
“*” を指定すると残り領域を比率で分割する Starサイズ となり、サンプルでは 50% : 50% の均等な幅になります。

比率を変更することもでき、”2*” のように指定すると他の “*” のカラムの 2倍の幅 を取ります。

また “Auto” を指定すると、配置されるコントロールのサイズに合わせて幅が自動調整されます。

owの設定

Rowの定義はColumnと基本的に同じです。
RowDefinitions を使って行数を定義し、Height プロパティで高さを指定します。