WPF Window with 3 Grid

Question

I want to build application that in the main window i have 3 Grid and 2 GridSplitter between them:

<Window x:Class="PlayTube.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="600" Width="625">
    <Grid Background="#FFD86F6F">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="200"/>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="300"/>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>

        <Grid Background="#FFFFFF89" MaxWidth="200">

        </Grid>

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

        <Grid Background="#FF05BECB" Grid.Column="2">

        </Grid>

        <GridSplitter HorizontalAlignment="Right" 
                  VerticalAlignment="Stretch" 
                  Grid.Column="3" ResizeBehavior="PreviousAndNext"
                  Width="5" Background="#FFBCBCBC"/>

        <Grid Background="#FF4E04A7" Grid.Column="4">

        </Grid>
    </Grid>
</Window>

And i want that the first two Grids will be maximum 200 px width. and when i try to re-size with the GridSplitter the grid stay maximum 200 but i can see the main grid color.

Any idea what is the problem?

Answer 1

Try moving the MaxWidth property to the ColumnDefinition instead of the grid.

<Window x:Class="WpfApplication1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="600" Width="625">
    <Grid Background="#FFD86F6F">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="200" MaxWidth="200"/>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="300"/>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>

        <Grid Background="#FFFFFF89" >

        </Grid>

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

        <Grid Background="#FF05BECB" Grid.Column="2">

        </Grid>

        <GridSplitter HorizontalAlignment="Right" 
                  VerticalAlignment="Stretch" 
                  Grid.Column="3" ResizeBehavior="PreviousAndNext"
                  Width="5" Background="#FFBCBCBC"/>

        <Grid Background="#FF4E04A7" Grid.Column="4">

        </Grid>
    </Grid>
</Window>