[C#/WPF] CollectionView 클래스 : GroupDescriptions 속성을 사용해 그룹핑 설정하기

■ CollectionView 클래스의 GroupDescriptions 속성을 사용해 그룹핑을 설정하는 방법을 보여준다.

TestProject.zip

0.01MB

▶ MainWindow.xaml

<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Width="800"
    Height="600"
    Title="TestProject"
    FontFamily="나눔고딕코딩"
    FontSize="16">
    <StackPanel Margin="10">
        <StackPanel.Resources>
            <XmlDataProvider x:Key="XmlDataProviderKey"
                XPath="Tasks/Task">
                <x:XData>
                    <Tasks xmlns="">
                        <Task Name="Groceries"
                            Priority="2"
                            Type="Home">
                            <Description>Pick up Groceries and Detergent</Description>
                        </Task>
                        <Task Name="Laundry"
                            Priority="2"
                            Type="Home">
                            <Description>Do Laundry</Description>
                        </Task>
                        <Task Name="Email"
                            Priority="1"
                            Type="Work">
                            <Description>Email Clients</Description>
                        </Task>
                        <Task Name="Clean"
                            Priority="3"
                            Type="Work">
                            <Description>Clean my office</Description>
                        </Task>
                        <Task Name="Dinner"
                            Priority="1"
                            Type="Home">
                            <Description>Get ready for family reunion</Description>
                        </Task>
                        <Task Name="Proposals"
                            Priority="2"
                            Type="Work">
                            <Description>Review new budget proposals</Description>
                        </Task>
                    </Tasks>
                </x:XData>
            </XmlDataProvider>
        </StackPanel.Resources>
        <TextBlock
            FontSize="20"
            FontWeight="Bold"
            Text="My Task List" />
        <CheckBox Name="groupByTaskTypeCheckBox"
            Margin="0 10 0 0">
            Group by task type
        </CheckBox>
        <ItemsControl Name="itemsControl"
            Margin="0 10 0 0"
            ItemsSource="{Binding Source={StaticResource XmlDataProviderKey}}">
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <DataTemplate.Resources>
                        <Style TargetType="TextBlock">
                            <Setter Property="FontSize"            Value="18"     />
                            <Setter Property="HorizontalAlignment" Value="Center" />
                        </Style>
                    </DataTemplate.Resources>
                    <Grid>
                        <Ellipse Fill="Silver" />
                        <StackPanel>
                            <TextBlock
                                Margin="10 10 10 0"
                                Text="{Binding XPath=@Name}" />
                            <TextBlock
                                Margin="10 10 10 10"
                                Text="{Binding XPath=@Priority}" />
                        </StackPanel>
                    </Grid>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
            <ItemsControl.ItemContainerStyle>
                <Style>
                    <Setter Property="Control.Width"  Value="120" />
                    <Setter Property="Control.Margin" Value="10"  />
                </Style>
            </ItemsControl.ItemContainerStyle>
            <ItemsControl.GroupStyle>
                <GroupStyle>
                    <GroupStyle.HeaderTemplate>
                        <DataTemplate>
                            <TextBlock
                                Margin="10"
                                FontSize="18"
                                FontWeight="Bold"
                                Text="{Binding Path=Name}" />
                        </DataTemplate>
                    </GroupStyle.HeaderTemplate>
                </GroupStyle>
            </ItemsControl.GroupStyle>
        </ItemsControl>
    </StackPanel>
</Window>

 

▶ MainWindow.xaml.cs

using System.Windows;
using System.Windows.Data;

namespace TestProject
{
    /// <summary>
    /// 메인 윈도우
    /// </summary>
    public partial class MainWindow : Window
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Field
        ////////////////////////////////////////////////////////////////////////////////////////// Private

        #region Field

        /// <summary>
        /// 컬렉션 뷰
        /// </summary>
        private CollectionView collectionView;

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - MainWindow()

        /// <summary>
        /// 생성자
        /// </summary>
        public MainWindow()
        {
            InitializeComponent();

            this.groupByTaskTypeCheckBox.Checked   += groupByTaskTypeCheckBox_Checked;
            this.groupByTaskTypeCheckBox.Unchecked += groupByTaskTypeCheckBox_Unchecked;
        }

        #endregion

        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Private

        #region Group By Task Type 체크 박스 체크시 처리하기 - groupByTaskTypeCheckBox_Checked(sender, e)

        /// <summary>
        /// Group By Task Type 체크 박스 체크시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void groupByTaskTypeCheckBox_Checked(object sender, RoutedEventArgs e)
        {
            this.collectionView = (CollectionView)CollectionViewSource.GetDefaultView(this.itemsControl.ItemsSource);

            if(this.collectionView.CanGroup)
            {
                PropertyGroupDescription groupDescription = new PropertyGroupDescription("@Type");

                this.collectionView.GroupDescriptions.Add(groupDescription);
            }
        }

        #endregion
        #region Group By Task Type 체크 박스 체크 해제시 처리하기 - groupByTaskTypeCheckBox_Unchecked(sender, e)

        /// <summary>
        /// Group By Task Type 체크 박스 체크 해제시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void groupByTaskTypeCheckBox_Unchecked(object sender, RoutedEventArgs e)
        {
            this.collectionView = (CollectionView)CollectionViewSource.GetDefaultView(this.itemsControl.ItemsSource);

            this.collectionView.GroupDescriptions.Clear();
        }

        #endregion
    }
}