Horizntal GridSplitter

I am trying to use a GridSplitter that will split between rows in a grid, but I'm having some trouble with it.
I've defined the 'ResizeDirection' attribute of the GridSplitter to be 'rows', but the GridSplitter stays a vertical one instead of becoming a horizontal one.
I created a simple example for showing my problem.
What am I doing wrong?

Code:

---

<Grid>
        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
        </Grid.ColumnDefinitions>
        <Button Grid.Row="0"
                Grid.Column="0"
                Content="0,0"/>
        <GridSplitter Grid.Row="0"
                      ResizeDirection="Rows"
                      Width="5"
                      Background="Red"/>
        <Button Grid.Row="1"
                Grid.Column="0"
                Content="0,1"/>
</Grid>

---

<Grid >
<Grid.RowDefinitions>
<RowDefinition Height="126*" />

</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="146*" />
<ColumnDefinition Width="132*" />
</Grid.ColumnDefinitions>

<GridSplitter HorizontalAlignment="Stretch" Name="gridSplitter1" />

</Grid>

Instead of changing the ResizeDirection="Rows" you can give a single Row definition.
If you want to define more rows and columns. Tell me the design i will help you out.
If any confusion let me know.

Aditi

I don't understand your solution, and it doesn't really work.
All I want is 2 rows and a horizontal splitter between them.
(You defined 2 columns, and the splitter doesn't work).
Do you konw how to do what I want?

I didn't really knew the use of grid splitter. But i knew the properties of a grid. so, I went through 1 example and now i am through with it i think this peice of code will definitely work for you. It has two rows with a gridsplitter in between them. And it resizes the row too.

1. This is my peice of code
<Grid>

<Grid.RowDefinitions>

<RowDefinition Height="120"></RowDefinition>
<RowDefinition Height="10"></RowDefinition>
<RowDefinition></RowDefinition>
</Grid.RowDefinitions>

<Grid.ColumnDefinitions>

<ColumnDefinition ></ColumnDefinition>



</Grid.ColumnDefinitions>

<Grid Grid.Column="0" Background="Yellow"></Grid>

<GridSplitter Background="Red" Grid.Column="0" Grid.Row="1" Height="Auto" Width="Auto" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />

<Grid Grid.Row="2" Background="Pink" ></Grid>

</Grid>

2. And worked on your code too.

<Grid>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
<RowDefinition/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Button Grid.Row="0"
Grid.Column="0"
Content="0,0"/>
<GridSplitter Grid.Row="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"
ResizeDirection="Rows"
Width="Auto" Height="Auto"
Background="Red"/>
<Button Grid.Row="2"
Grid.Column="0"
Content="0,1"/>
</Grid>
Do reply and please do check this out.

I tried your code, and it works.
From your code I understand that you have to define another row for the GridSplitter.
So, lots of thanks :)

I will create another RowDefinition for the grid splitter like so:
<Grid>
<!-- Create a 3 row Grid -->
<Grid.RowDefinitions>
<!-- Row that contains the ListView. -->
<RowDefinition Height="200" />
<!-- Row that contains the GridSplitter. -->
<RowDefinition Height="Auto" />
<!-- Row that contains the data for the selected section. -->
<RowDefinition Height="*" />
</Grid.RowDefinitions>

Then I will define the GridSplitter and place it in the 2nd row, or row index 1:
<GridSplitter Grid.Row="1" Grid.Column="0"
HorizontalAlignment="Stretch" VerticalAlignment="Center" ResizeBehavior="PreviousAndNext"
Height="5"
Background="DarkGray"/>
</Grid>