WPF vertical gridsplitter not working

Question

I have a vertical gridsplitter, but I get an horizontal one instead. here is my XAML

<GroupBox Header="Phase Management">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="5"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>

            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="70*"/>
                <RowDefinition Height="30*"/>
            </Grid.RowDefinitions>

            <Button>Test column 0</Button>

            <GridSplitter Grid.Column="1" Width="5" HorizontalAlignment="Stretch" Background="#FFFFFF" ResizeBehavior="PreviousAndNext"/>

            <Button Grid.Column="2">Test column 2</Button>

        </Grid>
    </GroupBox>

in the grid I have a stack panel, a data grid and some text boxes. Any idea of why I'm having the wrong behavior?

Answer 1

Try to add additional properties like

<GridSplitter Grid.Column="1"
              ResizeDirection="Columns"
              ResizeBehavior="PreviousAndNext"
              HorizontalAlignment="Stretch"/>

for the direction (in your case "Columns") and for the behavior (in the example for resizing in both directions, left and right).

Answer 2

Your XAML doesn't work. Please fix it.

Anyway I took some of your code and made some minor changes so it compiled and I get a vertical splitter:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="5"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>

    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="70*"/>
        <RowDefinition Height="30*"/>
    </Grid.RowDefinitions>

    <Button>Test column 0</Button>

    <GridSplitter Grid.Column="1" Width="5" HorizontalAlignment="Stretch" Background="#FFFFFF"/>

    <Button Grid.Column="2">Test column 2</Button>
</Grid>