WPF 分隔控件 Creating a Horizontal GridSplitter in WPF - for real

分隔控件的简单使用方法：

收藏备用。

来自：http://codebetter.com/blogs/steve.hebert/archive/2008/04/16/creating-a-horizontal-gridsplitter-for-real.aspx

 

I ran into a number of articles on the web declaring how to create a horizontal grid splitter control in WPF - most of them wrong. There are a couple of "Walkthru" articles on MSDN that show the proper way to do it, but waste time poking around the Properties window (who codes like that anyway?). Besides, they are not all consistent - the first article I found calls for setting properties that are not listed in the second article I found and seem to be extraneous.   

So here is a concise description focusing on the XAML alone - I haven't found a decent XAML code beautifier on the web yet so bare with me.  I am not inheriting any styles as you can see below.

First,  create a Grid with an additional row to host the horizontal splitter.  Note that in this example I have two columns in my grid to show the spanning function:

<Grid VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
        <Grid.ColumnDefinitions >
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="*"  />       
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="*" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

Next, create a GridSplitter on row #1 (remember that row indices are 0 based). 

<GridSplitter
            ResizeDirection="Rows"
            Grid.Column="0"
            Grid.ColumnSpan="2"
            Grid.Row="1"
            Width="Auto"
            Height="3"
            HorizontalAlignment="Stretch"
            VerticalAlignment="Stretch"
            Margin="0"/>

And there you have it.