WPF DataGrid显示多种类型

Question

在WPF数据网格中显示多种类型数据的最佳方法是什么。 例如，类别和产品：

| Product Name | Description  | Price |
---------------------------------------
IT  - category
---------------------------------------
  Monitors - category
---------------------------------------
| Monitor 1    | ...          | 100 $ |
| Monitor 2    | ...          |  99 $ |
| Monitor 3    | ...          | 120 $ |
---------------------------------------
  HDD - category
---------------------------------------
| Hdd 1        | ...          | 50 $ |
| Hdd 2        | ...          | 45 $ |
---------------------------------------
Electronics category
---------------------------------------
 ...

我想在产品列的顶部显示，并更改类别的模板。 我知道有一个单元格模板选择器，但有没有办法为整行指定模板选择器？ 谢谢。

Answer 1

如果您为数据创建CollectionViewsource，则可以使用集合PropertyGroupDescription中的GroupDescriptions按照您希望的属性对所有数据进行分组。

然后在DataGrid中，您可以创建GroupStyle以显示TextBlock或其他内容，以便将DataGrid中的所有群组分开。

这是一个完整的工作演示，因为它比解释更容易展示：）

的Xaml：

<Window x:Class="WpfApplication20.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="505" Width="525" Name="UI">

    <Window.Resources>

        <!--Create CollectionViewSource and set the property you want to group by-->
        <CollectionViewSource x:Key="MyItems" Source="{Binding Items, ElementName=UI}">
            <CollectionViewSource.GroupDescriptions>
                <PropertyGroupDescription PropertyName="Category" />
            </CollectionViewSource.GroupDescriptions>
        </CollectionViewSource>
    </Window.Resources>

    <Grid>
        <DataGrid ItemsSource="{Binding Source={StaticResource MyItems}}">
            <DataGrid.GroupStyle>
                <GroupStyle>
                    <GroupStyle.HeaderTemplate>
                        <DataTemplate>
                            <StackPanel>
                                <!--Name property is the GroupName created by the CollectionViewSource-->
                                <TextBlock Text="{Binding Path=Name}" Margin="10,0,0,0" FontSize="18" FontWeight="Bold"/>
                            </StackPanel>
                        </DataTemplate>
                    </GroupStyle.HeaderTemplate>
                </GroupStyle>
            </DataGrid.GroupStyle>
        </DataGrid>
    </Grid>
</Window>

代码：

namespace WpfApplication20
{
    public partial class MainWindow : Window
    {
        private ObservableCollection<MyDataObject> _items = new ObservableCollection<MyDataObject>();

        public MainWindow()
        {
            InitializeComponent();
            Items.Add(new MyDataObject { Category = "IT", ProductName = "Stackoverflow", Description = "Group", Price = "Demo" });
            Items.Add(new MyDataObject { Category = "Monitors", ProductName = "Stackoverflow", Description = "Group", Price = "Demo" });
            Items.Add(new MyDataObject { Category = "Monitors", ProductName = "Stackoverflow", Description = "Group", Price = "Demo" });
            Items.Add(new MyDataObject { Category = "Monitors", ProductName = "Stackoverflow", Description = "Group", Price = "Demo" });
            Items.Add(new MyDataObject { Category = "HDD", ProductName = "Stackoverflow", Description = "Group", Price = "Demo" });
            Items.Add(new MyDataObject { Category = "HDD", ProductName = "Stackoverflow", Description = "Group", Price = "Demo" });
        }

        public ObservableCollection<MyDataObject> Items
        {
            get { return _items; }
            set { _items = value; }
        }
    }

    public class MyDataObject
    {
        public string Category { get; set; }
        public string ProductName { get; set; }
        public string Description { get; set; }
        public string Price { get; set; }
    }
}

结果：

增强

覆盖GroupItem DataGrid中的ContainerStyle模板以使用Expander可能是一个不错的主意，这样您就可以展开折叠组。

示例：

    <DataGrid ItemsSource="{Binding Source={StaticResource MyItems}}" CanUserAddRows="False">
        <DataGrid.GroupStyle>
            <GroupStyle>
                <GroupStyle.ContainerStyle>
                    <Style TargetType="{x:Type GroupItem}">
                        <Setter Property="Template">
                            <Setter.Value>
                                <ControlTemplate TargetType="{x:Type GroupItem}">
                                    <Expander Name="expander">
                                        <Expander.Header>
                                            <StackPanel >
                                                <TextBlock Text="{Binding Name}" FontWeight="Bold"/>
                                                <TextBlock Text="{Binding ItemCount, StringFormat={}Items: {0}}" FontSize="9" />
                                            </StackPanel>
                                        </Expander.Header>
                                        <ItemsPresenter />
                                    </Expander>
                                </ControlTemplate>
                            </Setter.Value>
                        </Setter>
                    </Style>
                </GroupStyle.ContainerStyle>
            </GroupStyle>
        </DataGrid.GroupStyle>
    </DataGrid>

结果：