GridSplitter 的 ResizeBehavior 属性介绍

我们先来看一个我们在使用 GridSplitter 时，经常可能会碰到的问题：

把一个窗体分成2部分，这两部分中间是一个GridSplitter来支持这左右两部分的宽度变动。类似下面的效果图：

中间红色就是分割线，这个分割线支持左右两部分的宽度变更，一般我们会把这个需求写成类似下面XAML文件的方式：

<Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    x:Class="WpfApplication_GridSplitter.Window1"
    Title="Window1" Height="100" Width="300">
    <Grid Width="Auto" Height="Auto" >
        <Grid.ColumnDefinitions >
            <ColumnDefinition Width="*"  />
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="5*" />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions />
        <StackPanel Grid.Column="0"  Background="DarkBlue" />
        <GridSplitter Grid.Column="1"  Width="3" Background="Red" />
        <StackPanel Grid.Column="2"  Background="#FFAEA130" />
    </Grid>
</Window>

但是仅仅上面的代码，我们在拖动分割线的时候，会发现，分割线右边的尺寸发生变化了，而左边的尺寸没有发生变化，类似下面效果图：

中间出现了一个空白区域。

这是为何呢？？

原因很简单， GridSplitter 默认的 ResizeBehavior 属性为：BasedOnAlignment

ResizeBehavior 属性是一个枚举类型：GridResizeBehavior ，这个枚举类型包含以下枚举项：

BasedOnAlignment    根据VerticalAlignment 和 HorizontalAlignment 属性来确定分割线移动后，有哪些项被移动
CurrentAndNext        Grid 当前所在的区域以及下一个区域被影响
PreviousAndCurrent  前一个和当前区域被影响
PreviousAndNext      前一个和后一个区域被影响

我们把这个XAML文件改成下面方式就可以左右联动了。注意，只改动了加粗，加红的这一个属性。

<Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    x:Class="WpfApplication_GridSplitter.Window1"
    Title="Window1" Height="100" Width="300">
    <Grid Width="Auto" Height="Auto" >
        <Grid.ColumnDefinitions >
            <ColumnDefinition Width="*"  />
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="5*" />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions />
        <StackPanel Grid.Column="0"  Background="DarkBlue" />
        <GridSplitter Grid.Column="1"  Width="3" Background="Red"

ResizeBehavior="PreviousAndNext" />
        <StackPanel Grid.Column="2"  Background="#FFAEA130" />
    </Grid>
</Window>

改动后的效果图：

总结：

GridSplitter 的默认 ResizeBehavior 属性导致我们无法实现左右联动，我们只需要简单的修改这个属性就实现左右联动。

这个问题，由于是第一次接触WPF，让我花了好几个星期，才发现是这里简单的问题所导致的。所以特写此篇博客，希望对碰到这个问题人有所帮助。

参考资料：

MSDN GridResizeBehavior Enumeration