none
items are not displayed after grouping in ItemsControl RRS feed

  • Question

  • I've added grouping to ItemsControl:

                    <ItemsControl Style="{StaticResource SellingDashboardToDosList}" Grid.Row="2" BorderThickness="1" Background="#C7E8F8" HorizontalAlignment="Stretch" ItemsSource="{Binding ToDoList}" >
                        <ItemsControl.GroupStyle>
                            <GroupStyle>
                                <GroupStyle.ContainerStyle>
                                    <Style TargetType="GroupItem">
                                        <Setter Property="Template">
                                            <Setter.Value>
                                                <ControlTemplate TargetType="GroupItem">
                                                    <GroupBox Header="{Binding Name}">
                                                        <ItemsPresenter />
                                                    </GroupBox>
                                                </ControlTemplate>
                                            </Setter.Value>
                                        </Setter>
                                    </Style>
                                </GroupStyle.ContainerStyle>
                            </GroupStyle>
                        </ItemsControl.GroupStyle>
                    </ItemsControl>

    Now I see only empty GroupBoxes. I've used Snoop tool to explore the application and I found out that GroupBox ItemPresenters are empty! What could be the reason of it?

    If I remove the grouping from the ItemsControl (the ItemsControl.GroupStyle element), then everything works fine, and I see all items again. I don't need to make any changes to the underlying data context to see all items. The data context (the ItemsSource binging) is of type `SynchronisedObservableCollection<ITodoItemViewModel>` .

    Monday, July 16, 2012 10:52 AM

Answers

  • It appears that ItemsControl style was overriding ItemsControl.Template property. The problem was solved once that style got overridden.
    Monday, July 16, 2012 1:26 PM

All replies

  • Hi Bogdan

     

    You haven't shown a complete example, so it is not possible to see exactly where you went wrong, but I can make a guess and provide a working version for you to compare or use.

     

    You didn't mention if you use a CollectionViewSource, which contains the GroupDescriptions of the PropertyGroups you are grouping on. Also, you did not show what ToDoList is, which needs to be the CollectionViewSource.View (the rearranged collection with group descriptions added). It is the View's GroupDescriptions that the GroupStyle needs to work on.

     

    Below is a fully working example, made out of your example.

     

    MainWindow.xaml

    <Window x:Class="PEJL_WPF_Examples.MainWindow"
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
            Title="MainWindow" Height="350" Width="525" xmlns:local="clr-namespace:PEJL_WPF_Examples">
        
        <Window.Resources>
            <Style x:Key="SellingDashboardToDosList" TargetType="ItemsControl">
                <Setter Property="ItemTemplate">
                    <Setter.Value>
                        <DataTemplate>
                            <GroupBox Background="Yellow" Header="{Binding Name}">
                                <TextBlock Text="{Binding Description}"/>
                            </GroupBox>
                        </DataTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </Window.Resources>
    
        <Grid>
            <ItemsControl x:Name="ic1" Style="{StaticResource SellingDashboardToDosList}" Grid.Row="2" BorderThickness="1" Background="#C7E8F8" HorizontalAlignment="Stretch" ItemsSource="{Binding ToDoList.View}" >
                <ItemsControl.GroupStyle>
                    <GroupStyle>
                        <GroupStyle.ContainerStyle>
                            <Style TargetType="GroupItem">
                                <Setter Property="Template">
                                    <Setter.Value>
                                        <ControlTemplate TargetType="GroupItem">
                                            <GroupBox Background="Red" Header="{Binding Name}">
                                                <ItemsPresenter />
                                            </GroupBox>
                                        </ControlTemplate>
                                    </Setter.Value>
                                </Setter>
                            </Style>
                        </GroupStyle.ContainerStyle>
                    </GroupStyle>
                </ItemsControl.GroupStyle>
            </ItemsControl>
        </Grid>
    
    </Window>
    
      

    MainWindow.xaml.cs

    using System.Windows;
    using System.Collections.ObjectModel;
    using System.Windows.Data;
    
    namespace PEJL_WPF_Examples
    {
        public partial class MainWindow : Window
        {
            public ObservableCollection<AnItem> MyList { get; set; }
    
            public CollectionViewSource ToDoList { get; set; }
    
            public MainWindow()
            {
                InitializeComponent();
    
                MyList = new ObservableCollection<AnItem>
                {
                    new AnItem("aaaa", "nbnbnbnbnbbn"),
                    new AnItem("bbbb", "erterteteterte"),
                    new AnItem("aaaa", "tyutututu"),
                    new AnItem("bbbb", "erterteteterte"),
                };
    
                ToDoList = new CollectionViewSource
                {
                    Source = MyList
                };
                ToDoList.GroupDescriptions.Add(new PropertyGroupDescription("Name"));
    
                DataContext = this;
            }
        }
    
        public class AnItem
        {
            public string Name { get; set; }
            public string Description { get; set; }
    
            public AnItem(string name, string description)
            {
                Name = name;
                Description = description;
            }
        }
    }
    
      

    For an extra bonus point, I had a quick rummage down the back of the Internet and pulled out this nice tutorial, which shows an XAML version of the CollectionViewSource, in case you'd prefer that method.

     

    Regards,
    Pete


    #PEJL

    Monday, July 16, 2012 12:30 PM
    Moderator
  • It appears that ItemsControl style was overriding ItemsControl.Template property. The problem was solved once that style got overridden.
    Monday, July 16, 2012 1:26 PM
  • Thank you for your deliberate and interesting answer, but the problem was with ItemsControl styling.
    Monday, July 16, 2012 1:27 PM