Increase WPF GridSplitter mouse grabbing threshold

Question

Is it possible to increase the distance from a grid splitter from which the user can grab it?

My splitter is only 1px in width. I would like to be able to grab the splitter from a greater distance.

As it is now i must point the mouse on the exact 1px line to grab it.

And the splitter must still be 1px in width

Answer 1

You can change the actual size of the GridSplitter while keeping it looking like it's smaller. This will give you a 7 pixel width area to grab it while showing at 1 pixel:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition/>
        <ColumnDefinition Width="1"/>
        <ColumnDefinition/>
    </Grid.ColumnDefinitions>
    <GridSplitter Grid.Column="1"
                  Margin="-3,0"
                  BorderThickness="3,0"
                  BorderBrush="Transparent"
                  HorizontalAlignment="Stretch" />
</Grid>

The example is using the method of giving the splitter its own column but the same principle applies if it's Left or Right aligned in a shared column.

Answer 2

I wasn't able to get John Bowen's solution to work. It looked like it worked, but it seemed like the splitter only had 1 pixel of grab space.

I ended up doing this:

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition/>
        <RowDefinition Height="Auto"/>
        <RowDefinition/>
    </Grid.RowDefinitions>
    <Stackpanel Grid.Row="0"/>
    <GridSplitter
        Grid.Row="1"
        HorizontalAlignment="Stretch"
        BorderBrush="DarkGray"
        Height="6"
        Background="Transparent"
        BorderThickness="0,1,0,0"
        Margin="0,0,0,-4"/>
    <Stackpanel Grid.Row="2"/>
</Grid>

This gives the splitter 6 pixels of height, but shows only the 1 pixel top border line. You use a negative bottom margin of ((Height / 2) - 1) in order to center that top margin line in the middle of the row.

The Background is Transparent otherwise you will see 6 pixels of gray or w/e the default color is. If you dig into the control template for GridSplitter with Blend you find out it's just a styled Rectangle with a Border or something like that.