How can I get a ListView GridViewColumn to fill the remaining space in my grid?

Question

I want to create a ListView that has two columns with a fixed width and a third column to fill in the remaining space. So something like this:

<ListView>     <ListView.View>         <GridView>             <GridViewColumn Header="Name" Width="*" />             <GridViewColumn Header="Age" Width="50" />             <GridViewColumn Header="Gender" Width="50" />         </GridView>     </ListView.View> </ListView> 

The problem is I can't find a way to get the Name column to fill in the remaining space, as setting the width to * doesn't work. It looks like there is a way to do this with a value converter, but it seems like there should be a simpler way. Like with a DataGrid control, you can specify the widths of columns with *s.

Answer 1

Came across this when looking into a similar problem, my issue was I wanted all columns to be 'Auto' expect the first, which would just fill in the extra space, so I expanded on GONeale's solution.

private void ListView_SizeChanged(object sender, SizeChangedEventArgs e) {     ListView _ListView = sender as ListView;     GridView _GridView = _ListView.View as GridView;     var _ActualWidth = _ListView.ActualWidth - SystemParameters.VerticalScrollBarWidth;     for (Int32 i = 1; i < _GridView.Columns.Count; i++)     {         _ActualWidth = _ActualWidth - _GridView.Columns[i].ActualWidth;     }     _GridView.Columns[0].Width = _ActualWidth; } 

Then the XAML is simply:

... <ListView.View>     <GridView>         <GridViewColumn Header="Title" />         <GridViewColumn Header="Artist" Width="Auto" />         <GridViewColumn Header="Album" Width="Auto" />         <GridViewColumn Header="Genre" Width="Auto" />     </GridView> </ListView.View> ... 

This code could also be used on more generically as number of columns isn't hard-coded and with a little tweaking you could probably make the 'fill column' definable through some sort of logic.

Hope it helps someone :)

Answer 2

I was trying to achieve the same thing but then decided I would like my ListView columns to consume a percentage of the ListView instead, the result of this is all columns consuming a portion of space and all space being consumed in the ListView. You could set this up to have whatever percentage you like on the last column to directly achieve your 'fill remaining space on last column' goal.

I find this method fairly robust and reliable (even on resize!) so thought I might share.

I have four columns in my ListView for this example. All you need is to register the SizeChanged event in your ListView with the below event handler:

private void ProductsListView_SizeChanged(object sender, SizeChangedEventArgs e) {     ListView listView = sender as ListView;     GridView gView = listView.View as GridView;      var workingWidth = listView.ActualWidth - SystemParameters.VerticalScrollBarWidth; // take into account vertical scrollbar     var col1 = 0.50;     var col2 = 0.20;     var col3 = 0.15;     var col4 = 0.15;      gView.Columns[0].Width = workingWidth*col1;     gView.Columns[1].Width = workingWidth*col2;     gView.Columns[2].Width = workingWidth*col3;     gView.Columns[3].Width = workingWidth*col4; }