Stopbyte

WPF GridSplitter MinWidth on Grid ColumnDefinition is not working

i have a Grid with two columns, the left side column used to show a list of items (ListBox) and the right side zone is reserved for a DataGrid.

The left side Column should have an initial width of 200px and Minimum allowed Width being 100px. The Right side zone, has a Width of “*” Full-Width and limited to 100px minimum Width.

Unfortunately when i use a GridSplitter like this it doesn’t work properly:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="200" MinWidth="100" />
        <ColumnDefinition Width="5"/> <!-- This Column used for the GridSplitter. -->
        <ColumnDefinition Width="*" MinWidth="100" />
    </Grid.ColumnDefinitions>
    <ListBox Grid.Column="0" />
    <GridSplitter Grid.Column="1" Background="White" HorizontalAlignment="Stretch" ResizeDirection="Columns" />
    <DataGrid Grid.Column="2" />
</Grid>

What is the issue in the code above? thanks

1 Like

The Issue


That’s a very common issue;

And i think here is how it’s caused:

  • Your Column Initial Width one has 200 while the other Has “*” (ignore the 5px as it makes no difference).

  • Now the GridSplitter Tries to check whether the Minimum Width is reached or not, by comparing the given MinWidth against the Initial Width “*”.

  • The width “*” is converted to double as Double.Nan, thus comparing “*” with 200 will always result in Nan, or in other words it cannot be done.

  • I believe it’s some sort of Bug/Mistake in the GridSplitter code and should be fixed in some coming .NET releases.

WORKAROUND:


Yet there is an easy workaround, which might give similar behavior as you wanted if not even a better one.

You can Set the Width of the First Column to "1"* and the Width of the second column to "3"*.

and Keep the Minimum Widths and other values as they are that should fix the problem.

XAML Example:

<Grid.ColumnDefinitions>
    <ColumnDefinition Width="1*" MinWidth="100" />
    <ColumnDefinition Width="5"/> <!-- This Column used for the GridSplitter. -->
    <ColumnDefinition Width="3*" MinWidth="100" />
</Grid.ColumnDefinitions>

NOTE:
You may use any values you want for the Column Width as long as all Resize-able columns are Similar, i.e. If you use "x"* for Column A then use "y"* for Column B, and if you use “x” for Column A then use “y” for Column B.

1 Like