如果在WPF中的Grid中加入GridSplitter(網格分割條),以下是最佳實踐。
- 配置設定整個一行或者一列給分割條,并把行高或者列寬設定為Auto
- 使用Grid.RowSpan或者Grid.ColumnSpan以讓它撐滿這個網格的全高或者全寬
- 為了使分割條看得更能清楚
-
- 設定它的寬度或者高度為一些足以看到的值,例如5
- 設定這個GridSplitter的Background屬性為更顯眼的顔色
- 設定這個GridSplitter的VerticalAlignment和HorizontalAlignment屬性(這個是容易忽略的一點)
- VerticalSplitter: VerticalAlignment=Stretch, HorizontalAlignment=Center
- HorizontalSplitter: VerticalAlignment=Center, HorizontalAlignment=Stretch
執行個體代碼:
<Window x:Class="WpfApplication1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow"
Height="350"
Width="525">
<Grid>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition Height="Auto" />
<RowDefinition />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition Width="Auto" />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Button Margin="5">Button 1</Button>
<Button Grid.Row="0"
Grid.Column="2"
Margin="5">Button 2</Button>
<Button Grid.Row="2"
Grid.Column="0"
Margin="5">Button 3</Button>
<Button Grid.Row="2"
Grid.Column="2"
Margin="5">Button 4</Button>
<GridSplitter Grid.Row="1"
Grid.Column="0"
Grid.ColumnSpan="3"
Height="5"
Background="Red"
HorizontalAlignment="Stretch"
VerticalAlignment="Center" />
<GridSplitter Grid.Row="0"
Grid.Column="1"
Grid.RowSpan="3"
Width="5"
Background="Blue"
VerticalAlignment="Stretch"
HorizontalAlignment="Center" />
</Grid>
</Window>
分割效果展示: