CODEWITHSUNDEEP
c#wpfxamlwpf-controls
Darius
Darius

Reputation: 727

Border inside a Grid containing GridSplitter-s overlaps all following rows

Using WPF I'm trying to create a Grid which contains A list view then some controller with details and then a row with a singe button. Here's what I tried

<Grid DataContext="...">
    <Grid.RowDefinitions>
        <RowDefinition Height="177" MinHeight="177"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <ListView Grid.Row="0"  BorderBrush="LightGray" BorderThickness="1,1,1,0">
        <ListView.View>
            <GridView x:Name="SomeName"/>
        </ListView.View>
    </ListView>
    <GridSplitter Grid.Row="1" Height="5" HorizontalAlignment="Stretch" ResizeDirection="Rows" BorderBrush="LightGray" BorderThickness="1,0,1,0"/>
    <Border Grid.Row="2" Grid.RowSpan="1" BorderBrush="LightGray" BorderThickness="1,0,1,1" Height="Auto" Padding="1">
        <ContentControl Grid.RowSpan="1" ContentTemplateSelector="{StaticResource someTemplateSelector}" Content="{Binding itemBinding, Mode=OneWay}" Height="Auto"/>
    </Border>
    <GridSplitter Grid.Row="3"  Height="5" HorizontalAlignment="Stretch" ResizeDirection="Rows" BorderBrush="LightGray" BorderThickness="1,0,1,0"/>
    <Button Grid.Row="4"  Grid.RowSpan="1" DockPanel.Dock="Right" Margin="3,0,0,0" Command="{Binding Click}" Width="28" Height="28" Padding="0" VerticalAlignment="Bottom">
        <Image Width="16" Height="16" Source="{StaticResource Heart}"/>
    </Button>
</Grid>

The above XAML is functional but the border overlaps all rows below and including row 2, instead of going just up to the next GridSplitter.

And it looks roughly like this:

enter image description here

Upvotes: 1

Views: 126

Answers (1)

am9417
am9417

Reputation: 1036

You have five rows but only three row definitions

Add the desired row definitions:

<Grid.RowDefinitions>
    <RowDefinition Height="177" MinHeight="177"/>
    <RowDefinition Height="Auto"/>
    <RowDefinition Height="*"/>
    <RowDefinition Height="Auto"/>
    <RowDefinition Height="*"/>
</Grid.RowDefinitions>

and the layout should be correct.

Upvotes: 1

Related Questions