WPF ListView grouping by 2 columns but display only 1 group header

Question

A ListView displays a collection of the following class:

public class Employee
{
    private string _department;
    private string _manager;
    private str         


        

Answer 1

I would create another model part, which represents the dual grouping that you need to have happen:

Model Classes:

public class EmployeeModel {

        private readonly Employee _Employee;

        public DepartmentManager ManagementInfo { get; private set; }

        public string Name {
            get { return _Employee.Name; }
        }
        public string Address {
            get { return _Employee.Address; }
        }

        public EmployeeModel(Employee employee) {
            this._Employee = employee;
            this.ManagementInfo = new DepartmentManager(employee.Department, employee.Manager);
        }
    }

    public class DepartmentManager {

        public string Department { get; private set; }
        public string Manager { get; private set; }

        public DepartmentManager(string dept, string manager) {
            this.Department = dept;
            this.Manager= manager;
        }

        public override bool Equals(object obj) {
            var model = obj as DepartmentManager;
            if(null == model)
                return false;

            return Department.Equals(model.Department, StringComparison.InvariantCultureIgnoreCase) && 
                Manager.Equals(model.Manager, StringComparison.InvariantCultureIgnoreCase);
        }
    }

XAML:

    <CollectionViewSource x:Key="cvsEmpsModel" Source="{Binding EmployeesModel}">
        <CollectionViewSource.GroupDescriptions>
            <PropertyGroupDescription PropertyName="ManagementInfo" />
        </CollectionViewSource.GroupDescriptions>
    </CollectionViewSource>

    <DataTemplate DataType="{x:Type models:EmployeeModel}">
        <StackPanel Orientation="Horizontal">
            <TextBlock Text="{Binding Name}" />
            <TextBlock Text="{Binding Address}" />
        </StackPanel>
    </DataTemplate>

...
    <ListView ItemsSource="{Binding Source={StaticResource cvsEmpsModel}}">
            <ListView.GroupStyle>
                <GroupStyle>
                    <GroupStyle.HeaderTemplate>
                        <DataTemplate>
                            <StackPanel Orientation="Horizontal" Margin="0,10,0,3" DataContext="{Binding Items}">
                                <TextBlock Text="{Binding Path=ManagementInfo.Manager}" FontWeight="Bold" Margin="3" />
                                <TextBlock Text="{Binding Path=ManagementInfo.Department, StringFormat='({0})'}" Margin="3" />
                            </StackPanel>
                        </DataTemplate>
                    </GroupStyle.HeaderTemplate>
                </GroupStyle>
            </ListView.GroupStyle>
        </ListView>

Then in your Window/ViewModel:

this.EmployeesModel = new ObservableCollection<EmployeeModel>(MyListOfEmployersFromDB.Select(e => new EmployeeModel(e)));

Note, I've overriden Equals in the DepartmentManager class, but not GetHashCode, ideally you should do a custom implementation of that. I had to override equals so the grouping view source would correctly group the same entries. You could get rid of this need, buy constructing the DepartmentManager for the same Employees outside of the collection, and pass them into the EmployeeModel ctr.

Answer 2

Solved the main stumbling block, question 2 above: how to bind from the group header to a property that is not the grouping property.

The solution is to change the data context to:{Binding Items}. The ItemSource properties are then available

<GroupStyle>
    <GroupStyle.HeaderTemplate>
        <DataTemplate>
            <StackPanel Orientation="Horizontal" Margin="0,10,0,3" DataContext="{Binding Items}" >
                <TextBlock Text="{Binding Path=Department}" FontWeight="Bold" Margin="3"/>
                <TextBlock Text="{Binding Path=Manager, StringFormat='({0})'}" Margin="3"/>
            </StackPanel>
        </DataTemplate>
    </GroupStyle.HeaderTemplate>
</GroupStyle>