方法 : GridSplitter を使用して行のサイズを変更する
更新 : 2007 年 11 月
この例では、水平 GridSplitter を使用して、Grid の寸法を変更せずに Grid 内の行間の領域を再配分する方法を示します。
使用例
行の端に重なって表示される GridSplitter を作成する方法
Grid 内の隣接する行のサイズを変更する GridSplitter を指定するには、サイズを変更する行の 1 つに Row添付プロパティを設定します。Grid に複数の列がある場合は、ColumnSpan 添付プロパティを設定して列の数を指定します。次に、VerticalAlignment を Top または Bottom に設定します (どちらの配置に設定するかは、サイズを変更する 2 行がどちらであるかによって異なります)。最後に、HorizontalAlignment のプロパティを Stretch に設定します。
隣接する行のサイズを変更する、水平 GridSplitter を定義する方法を次の例に示します。サンプル全体については、「行と列のサイズを変更する GridSplitter のサンプル」を参照してください。
<GridSplitter Grid.Row="1"
Grid.ColumnSpan="3"
HorizontalAlignment="Stretch"
VerticalAlignment="Top"
Background="Black"
ShowsPreview="true"
ResizeDirection="Columns"
Height="5"/>
固有の行を占有しない GridSplitter は、Grid 内の他のコントロールによって隠される場合があります。この問題を回避する方法の詳細については、「方法 : GridSplitter を表示されるようにする」を参照してください。
行を占有する GridSplitter を作成する方法
Grid 内の行を占有する GridSplitter を指定するには、サイズを変更する行の 1 つに Row添付プロパティを設定します。Grid に複数の列がある場合は、ColumnSpan 添付プロパティに列の数を設定します。次に、VerticalAlignment を Center に設定し、HorizontalAlignment プロパティを Stretch に設定して、GridSplitter を含む行の Height を Auto に設定します。
行を占有し、その行の両側の行のサイズを変更する水平 GridSplitter を定義する方法を次の例に示します。サンプル全体については、「行と列のサイズを変更する GridSplitter のサンプル」を参照してください。
<Grid.RowDefinitions>
<RowDefinition Height="50*" />
<RowDefinition Height="Auto" />
<RowDefinition Height="50*" />
</Grid.RowDefinitions>
...
<StackPanel Grid.Row="0" Grid.Column="1" Background="Tan"/>
<GridSplitter Grid.Row="1"
HorizontalAlignment="Stretch"
VerticalAlignment="Center"
Background="Black"
ShowsPreview="True"
Height="5"
/>
<StackPanel Grid.Row="2" Grid.Column="0" Background="Brown"/>