locked
How to group multilevel items using expander in Datagrid RRS feed

  • Question

  • I'm trying to achieve multilvel grouping using expander inside datagrid. i have tried CollectionViewSource by using which i can able to achieve single level grouping.

    my collection is having multilevel childrens i.e expander header or controls inside it.

    Thanks in advance.

    Wednesday, March 4, 2020 8:36 AM

All replies

  • Hi,

    I made an example,I hope it can help you.

     <Window.Resources>
            <local:GroupItemStyleSelector x:Key="groupItemStyleSelector"/>
            <ControlTemplate TargetType="{x:Type GroupItem}" x:Key="withExpander">
                <Expander IsExpanded="True">
                    <Expander.Header>
                        <StackPanel Orientation="Horizontal">
                            <TextBlock Text="Item"/>
    
                        </StackPanel>
                    </Expander.Header>
                    <ItemsPresenter />
                </Expander>
            </ControlTemplate>
    
    
            <ControlTemplate TargetType="{x:Type GroupItem}" x:Key="withOutExpander">
                <ItemsPresenter />
            </ControlTemplate>
            <Style x:Key="FirstLevel" TargetType="{x:Type GroupItem}">
                <Setter Property="Template" Value="{StaticResource withExpander}" />
    
                <Style.Triggers>
                    <DataTrigger Binding="{Binding Name}" Value="False">
                        <Setter Property="Template" Value="{StaticResource withOutExpander}"/>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
    
            <Style x:Key="SecondLevel" TargetType="{x:Type GroupItem}">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type GroupItem}">
                            <Expander IsExpanded="True" Margin="15,0,0,0">
                                <Expander.Header>
                                    <StackPanel Orientation="Horizontal">
                                        <TextBlock Text="ChildItem" TextBlock.FontWeight="Bold"/>
                                    </StackPanel>
                                    
                                </Expander.Header>
                                <ItemsPresenter />
                            </Expander>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
            <CollectionViewSource x:Key="ItemCollectionViewSource"  CollectionViewType="ListCollectionView">
                <CollectionViewSource.GroupDescriptions>
                    <PropertyGroupDescription PropertyName="Id"/>
                    <PropertyGroupDescription PropertyName="UId"/>
                </CollectionViewSource.GroupDescriptions>
            </CollectionViewSource>
         
        </Window.Resources>
        <Grid>
            <DataGrid AutoGenerateColumns="False" DataContext="{StaticResource ItemCollectionViewSource}" ItemsSource="{Binding}" CanUserAddRows="False">
                <DataGrid.GroupStyle>
                    <GroupStyle ContainerStyleSelector="{StaticResource groupItemStyleSelector}" />
                </DataGrid.GroupStyle>
                <DataGrid.Columns>
                    <DataGridTextColumn Binding="{Binding Id}" Header="Id"/>
    
                    <DataGridTextColumn Binding="{Binding Name}" Header="Name"/>
    
                    <DataGridTextColumn Binding="{Binding UId}" Header="UId"/>
                </DataGrid.Columns>
            </DataGrid>
        </Grid>
      public partial class MainWindow : Window
        {
            List<Student> stus = new List<Student>();
            CollectionViewSource items;
            public MainWindow()
            {
                InitializeComponent();
                stus.Add(new Student() { Id = 1, Name = "Name1",UId=1 });
                stus.Add(new Student() { Id = 2, Name = "Name2",UId=2});
                stus.Add(new Student() { Id = 1, Name = "Name3" ,UId=1});
                stus.Add(new Student() { Id = 2, Name = "Name4" ,UId=1});
                stus.Add(new Student() { Id = 2, Name = "Name5" ,UId=2});
                stus.Add(new Student() { Id = 1, Name = "Name6",UId=3});
                stus.Add(new Student() { Id = 2, Name = "Name7" ,UId=2});
                items = (CollectionViewSource)FindResource("ItemCollectionViewSource");
                items.Source = stus;
            }
        }
        public class GroupItemStyleSelector : StyleSelector
        {
            public override Style SelectStyle(object item, DependencyObject container)
            {
                Style s;
    
                CollectionViewGroup group = item as CollectionViewGroup;
                Window window = Application.Current.MainWindow;
    
                if (!group.IsBottomLevel)
                {
                    s = window.FindResource("FirstLevel") as Style;
                }
                else
                {
                    s = window.FindResource("SecondLevel") as Style;
                }
    
                return s;
            }
        }
        public class Student
        {
            public int Id { get; set; }
            public string Name { get; set; }
            public int UId { get; set; }
        }


    Best Regards,

    Alex


    "Windows Presentation Foundation" forum will be migrating to a new home on Microsoft Q&A (Preview)!
    We invite you to post new questions in the "Developing Universal Windows apps" forum’s new home on Microsoft Q&A (Preview)!
    For more information, please refer to the sticky post.

    Thursday, March 5, 2020 3:28 AM