GridSplitter resizes incorrectly

Question

On a Page derived class, I have some nested Grids.

I have changed the ColumnDefinition to the width of some pixels (i.e. around 5), with some columns having the width of "*".

All elements have Width="Auto".

Here is my Splitter:

<Grid Margin="10"
          HorizontalAlignment="Stretch"
          VerticalAlignment="Stretch"
          Grid.Background="SpringGreen">

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

        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="5*" />

        </Grid.RowDefinitions>

        <GridSplitter Grid.Row="1"
                      Grid.Column="3"
                      Width="Auto"
                      Height="Auto"
                      Margin="0"
                      HorizontalAlignment="Stretch"
                      VerticalAlignment="Stretch"
                      Background="Red"
                      BorderThickness="1,0"
                      Cursor="SizeWE"
                      RenderTransformOrigin="-1,1"
                      ShowsPreview="True" />
    </Grid>

So the problem is, it does almost no resizing to the left, but very much to the right. It is not depending on the window size, even in fullscreen, the splitter only allows some pixels to the left.

-edit- Are there any known problems that I did not find myself (on Google)? Anyone experienced similar strange behaviour?

-edit update- Found a minimum definition for the grid to reproduce the problem.

Can you show the XAML for the Grid, please? – Tim Rogers Feb 21 '13 at 11:40 — Tim Rogers, Feb 21 '13 at 11:40
Added the XAML parts for the grids – Mare Infinitus Feb 21 '13 at 13:04 — Mare Infinitus, Feb 21 '13 at 13:04

score 2 · Accepted Answer · answered Feb 21 '13 at 13:18

2

You have 3 columns of width 5 between the two *-width columns. The GridSplitter is in the middle of these. It works by resizing the preceding column (i.e. the first of your 5 pixel columns). You can't resize to the left because that column is only 5 pixels wide.

Remember that Row and Column properties are zero-based.

answered Feb 21 '13 at 13:18

Tim Rogers

21,297
6
52
68

First of all: You are right. I can reproduce the behaviour with the updated code in the question. But: How can I change it to resize even the "*" columns? Why is it working if I resize to the right handside? Why can I not have a Column between my Splitter and a "*" Column? – Mare Infinitus Feb 21 '13 at 14:20
It's working if you resize to the right because it is resizing the lefthand 5px column and expanding it to whatever you size you like. Try filling that column in red and see what happens. Why can't you have a column between your splitter and resizable column? Because that's not the way `GridSplitter` works - it sits between two columns that it resizes. It looks to me like you are using these other 5px columns to provide padding, margins or borders: if so, make use of proper margins and you shouldn't need these thin columns. – Tim Rogers Feb 21 '13 at 15:39

GridSplitter resizes incorrectly

1 Answers1