.Net(VB、C#)のWPFで要素の行・列のサイズを動的に変更する
<Grid>要素の行・列のサイズを動的に変更したい場合、<Grid>要素の子に<GridSplitter>要素を配置する。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 | <Window x:Class="WPFSample.Window1" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="GridSplitter" Height="300" Width="300"> <Grid> <Grid.RowDefinitions> <RowDefinition Height="*" /> <RowDefinition Height="auto" /> <RowDefinition Height="*" /> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition Width="*" /> <ColumnDefinition Width="auto" /> <ColumnDefinition Width="*" /> </Grid.ColumnDefinitions> <StackPanel Background="#ffcccc" /> <StackPanel Background="#ccffcc" Grid.Column="2"/> <StackPanel Background="#ccccff" Grid.Row="2" /> <StackPanel Background="#ccffff" Grid.Row="2" Grid.Column="2"/> <GridSplitter Grid.Row="1" Grid.ColumnSpan="3" Height="5" HorizontalAlignment="Stretch" /> <GridSplitter Grid.Column="1" Grid.RowSpan="3" Width="5" HorizontalAlignment="Stretch" /> </Grid> </Window> |
尚、<GridSplitter>要素を利用する場合、以下のような注意点がある。
<GridSplitter>要素自体、<Grid>要素のセルを1つ占有する為、<GridSplitter>要素を配置するための行・列を「auto」指定で作成しておく必要がある。
<GridSplitter>要素は、デフォルトの状態では幅も高さも「0」で不可視となる為、見えるサイズに調整する必要がある。
(HorizontalAlignment属性に「Stretch」を指定して、上下分割の場合はGrid.ColumnSpanとHeight、左右分割の場合はGrid.RowSpanとWidthにそれぞれ値を指定する)
「特定の1行だけ列幅を変えたい」というようなことは1つの<Grid>要素内では行えない為、<Grid>要素を入れ子にして内側の<Grid>要素だけに<GridSplitter>要素を追加するなどの工夫が必要になる。