Search code examples
wpfxamllistviewgrid-layoutgroupbox

Wpf - Grid using row and column definition - How to ignore columns for some rows

I'm trying to use the grid row / column definitions in my wpf application. At the moment, I need to implement a list view inside a GroupBox. Here I need to ignore the column definitions i set in the top in the view.

Row and column definitions: 

        <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
        <RowDefinition Height="260" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="250" />
        <ColumnDefinition Width="20" />
        <ColumnDefinition Width="180" />
        <ColumnDefinition Width="20" />
        <ColumnDefinition Width="180" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>

Here you see I have a rowDefinition with a height of 260. This should contain my list view. The problem is that it's inside the columns I have made and therefore it won't take all space. Is there somehow a setting so that this row will ignore the columns I have set? I still want the columns to be used for the other rows.

Here you see a picture of how it looks:

enter image description here

Hope someone can help, good day.

Solution

  • Just use attached property Grid.ColumnSpan :

    <ListView Grid.ColumnSpan="6"/>

    It will extend your ListView for 6 columns.

    Simple advice about your UI:

    I suggest you to create you resizable XAML, not static. I mean it is not good:

    <Grid.RowDefinitions>
    <RowDefinition Height="Auto" />
    <RowDefinition Height="Auto" />
    <RowDefinition Height="Auto" />
    <RowDefinition Height="Auto" />
    <RowDefinition Height="Auto" />
    <RowDefinition Height="Auto" />
    <RowDefinition Height="260" />
    <RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
    <ColumnDefinition Width="250" />
    <ColumnDefinition Width="20" />
    <ColumnDefinition Width="180" />
    <ColumnDefinition Width="20" />
    <ColumnDefinition Width="180" />
    <ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>

    However, it is better:

    <Grid.RowDefinitions>
    <RowDefinition Height="Auto" />
    <RowDefinition Height="Auto" />
    <RowDefinition Height="Auto" />
    <RowDefinition Height="Auto" />
    <RowDefinition Height="Auto" />
    <RowDefinition Height="Auto" />
    <RowDefinition Height="3*" />
    <RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
    <ColumnDefinition Width="*" />
    <ColumnDefinition Width="0.5*" />
    <ColumnDefinition Width="2*" />
    <ColumnDefinition Width="0.5*" />
    <ColumnDefinition Width="2*" />
    <ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>

    It gives resizable UI(XAML) at any display.