Group panel of WPF ListBox

Question

I have a listbox that is grouping the items with a GroupStyle. I would like add a control at the bottom of the stackpanel that holds all of the groups. This additional control needs to be part of the scrolling content so that the user would scroll to the bottom of the list to see the control. If I were using a listbox without the groups, this task would be easy by modifying the ListBox template. However, with the items grouped, the ListBox template seems to only apply on a per group basis. I can modify the GroupStyle.Panel, but that doesn't allow me to add items to that panel.

<ListBox>
<ListBox.ItemsPanel>
    <ItemsPanelTemplate>
        <WrapPanel/>
    </ItemsPanelTemplate>
</ListBox.ItemsPanel>
<ListBox.GroupStyle>
    <GroupStyle>
         <GroupStyle.Panel>
             <ItemsPanelTemplate>
                 <VirtualizingStackPanel/>  **<----- I would like to add a control to this stackpanel**
             </ItemsPanelTemplate>
         </GroupStyle.Panel>
        <GroupStyle.ContainerStyle>
            <Style TargetType="{x:Type GroupItem}">
                <Setter Property="Template">
                     <Setter.Value>
                         <ControlTemplate TargetType="{x:Type GroupItem}">
                              <Grid>
                                  <ItemsPresenter />
                              </Grid>
                         </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </GroupStyle.ContainerStyle>
    </GroupStyle>
</ListBox.GroupStyle>

This should give an idea of what I need to do:

GroupStyleNeeds

Draw a picture what you want exactly. Because I think that you can add your control after ListBox and not change the template. — vortexwolf, Jan 15 '11 at 23:50

Rick Sladkey · Accepted Answer · 2011-01-16T22:49:23.563

You can use the strategy you were planning on for a ListBox, just do it for a GroupItem instead. If you add this XAML to your GroupStyle, it will add an end-of-group TextBlock:

<GroupStyle.ContainerStyle>
    <Style TargetType="GroupItem">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type GroupItem}">
                    <StackPanel>
                        <ContentPresenter/>
                        <ItemsPresenter Margin="5,0,0,0"/>
                        <TextBlock Text="*** End of group ***"/>
                    </StackPanel>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</GroupStyle.ContainerStyle>

Edit:

Here is a complete XAML-only example of a grouped list with a scrollbar and additional content added to the end of the scrolling region:

<Grid Height="100">
    <Grid.Resources>
        <PointCollection x:Key="sampleData">
            <Point X="1" Y="1"/>
            <Point X="1" Y="2"/>
            <Point X="2" Y="3"/>
            <Point X="2" Y="4"/>
            <Point X="3" Y="5"/>
            <Point X="3" Y="6"/>
        </PointCollection>
        <CollectionViewSource x:Key="groupedSampleData" Source="{StaticResource sampleData}">
            <CollectionViewSource.GroupDescriptions>
                <PropertyGroupDescription PropertyName="X" />
            </CollectionViewSource.GroupDescriptions>
        </CollectionViewSource>
    </Grid.Resources>
    <ListBox ItemsSource="{Binding Source={StaticResource groupedSampleData}}">
        <ListBox.Template>
            <ControlTemplate TargetType="{x:Type ListBox}">
                <ScrollViewer CanContentScroll="True">
                    <StackPanel>
                        <ItemsPresenter/>
                        <TextBlock Text="*** End of list ***"/>
                    </StackPanel>
                </ScrollViewer>
            </ControlTemplate>
        </ListBox.Template>
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <TextBlock Text="{Binding Path=Y}"/>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <WrapPanel/>
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
        <ItemsControl.GroupStyle>
            <GroupStyle>
                <GroupStyle.Panel>
                    <ItemsPanelTemplate>
                        <VirtualizingStackPanel/>
                    </ItemsPanelTemplate>
                </GroupStyle.Panel>
                <GroupStyle.HeaderTemplate>
                    <DataTemplate>
                        <TextBlock Margin="4" FontWeight="Bold" FontSize="15" Text="{Binding Path=Name}"/>
                    </DataTemplate>
                </GroupStyle.HeaderTemplate>
            </GroupStyle>
        </ItemsControl.GroupStyle>
    </ListBox>
</Grid>

Thank you for the suggestion. The problem is that adds the textblock to each group. I need something at the end of all groups. — rulestein, Jan 16 '11 at 21:37
In that case, I would say your original conclusion that modifying the `ListBox` template affected groups is incorrect. **Something** has to contain the groups, and its not `GroupItem`. I'll post a complete example. — Rick Sladkey, Jan 16 '11 at 22:25
Thank you very much for the complete example. I am not sure why the listbox template wasn't working for me when I was messing with it, but your example is what I needed. — rulestein, Jan 16 '11 at 23:34

Group panel of WPF ListBox

1 Answers1

Linked