WPF+Prism MVVM模式下DataGrid数据分组实现方法求助

问题分析 #

你当前的代码已创建CollectionViewSource并添加分组描述，但DataGrid默认不会自动渲染分组UI，这是看不到分组的核心原因。另外还需确保列绑定和属性通知的正确性。

正确实现步骤 #

1. 完善ViewModel的属性与初始化 #

Prism ViewModel需继承BindableBase确保属性变更通知，同时正确初始化集合与分组配置：

using Prism.Mvvm;
using System.Collections.ObjectModel;
using System.Windows.Data;

public class MainViewModel : BindableBase
{
    public ObservableCollection<Product> MyCollection { get; set; }
    public CollectionViewSource MyCollectionViewSource { get; set; }

    public MainViewModel()
    {
        // 初始化并填充测试数据
        MyCollection = new ObservableCollection<Product>
        {
            new Product { Id = "H196A", Name = "Box A", Count = 3 },
            new Product { Id = "H197B", Name = "Box A", Count = 5 },
            new Product { Id = "H201C", Name = "Box B", Count = 2 },
            new Product { Id = "H205D", Name = "Box B", Count = 4 }
        };

        // 配置CollectionViewSource分组
        MyCollectionViewSource = new CollectionViewSource();
        MyCollectionViewSource.Source = MyCollection;
        MyCollectionViewSource.GroupDescriptions.Add(new PropertyGroupDescription(nameof(Product.Name)));
    }
}

public class Product
{
    public string Id { get; set; }
    public string Name { get; set; }
    public int Count { get; set; }
}

2. 配置DataGrid的列绑定与分组样式 #

XAML需补充列绑定路径和分组渲染模板，这是DataGrid显示分组的必要配置：

<DataGrid ItemsSource="{Binding MyCollectionViewSource.View}" 
          AutoGenerateColumns="False"
          CanUserAddRows="False">
    <!-- 绑定数据列 -->
    <DataGrid.Columns>
        <DataGridTextColumn Header="Id" Binding="{Binding Id}" Width="*"/>
        <DataGridTextColumn Header="Name" Binding="{Binding Name}" Width="*"/>
        <DataGridTextColumn Header="Count" Binding="{Binding Count}" Width="*"/>
    </DataGrid.Columns>

    <!-- 定义分组显示样式 -->
    <DataGrid.GroupStyle>
        <GroupStyle>
            <!-- 分组头部模板 -->
            <GroupStyle.HeaderTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal" Background="#FFE5E5E5" Padding="6" Margin="0">
                        <TextBlock Text="{Binding Name}" FontWeight="Bold" FontSize="12"/>
                        <TextBlock Text=" (共" Margin="8 0 0 0"/>
                        <TextBlock Text="{Binding ItemCount}"/>
                        <TextBlock Text="条)"/>
                    </StackPanel>
                </DataTemplate>
            </GroupStyle.HeaderTemplate>
            <!-- 分组容器样式（带折叠功能） -->
            <GroupStyle.ContainerStyle>
                <Style TargetType="{x:Type GroupItem}">
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type GroupItem}">
                                <Expander IsExpanded="True" BorderThickness="0">
                                    <Expander.Header>
                                        <ContentPresenter Content="{TemplateBinding Content}"/>
                                    </Expander.Header>
                                    <ItemsPresenter/>
                                </Expander>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </GroupStyle.ContainerStyle>
        </GroupStyle>
    </DataGrid.GroupStyle>
</DataGrid>

关键注意点 #

• 列必须绑定属性：原XAML中DataGridTextColumn未设置Binding，会导致数据无法显示，分组自然不可见。
• 必须添加GroupStyle：DataGrid不会自动生成分组UI，需通过GroupStyle定义分组头部的显示模板，示例中用Expander实现分组折叠/展开功能。
• 绑定CollectionViewSource的View：确保ItemsSource绑定的是MyCollectionViewSource.View，这是CollectionViewSource对外提供的可绑定视图对象。

内容的提问来源于stack exchange，提问作者UltraMurlock