Procédure : Grouper des éléments dans un ListView implémentant un GridViewHow to: Group Items in a ListView That Implements a GridView

Cet exemple montre comment afficher les groupes d’éléments dans le GridView mode d’affichage d’un ListView contrôle.This example shows how to display groups of items in the GridView view mode of a ListView control.

ExempleExample

Pour afficher les groupes d’éléments dans un ListView, définir un CollectionViewSource.To display groups of items in a ListView, define a CollectionViewSource. L’exemple suivant montre un CollectionViewSource qui regroupe les éléments de données en fonction de la valeur de la Catalog champ de données.The following example shows a CollectionViewSource that groups data items according to the value of the Catalog data field.

<CollectionViewSource x:Key='src' 
                      Source="{Binding Source={StaticResource MyData}, 
                               XPath=Item}">
  <CollectionViewSource.GroupDescriptions>
    <PropertyGroupDescription PropertyName="@Catalog" />
  </CollectionViewSource.GroupDescriptions>
</CollectionViewSource>

L’exemple suivant définit la ItemsSource pour le ListView à la CollectionViewSource qui définit l’exemple précédent.The following example sets the ItemsSource for the ListView to the CollectionViewSource that the previous example defines. L’exemple définit également un GroupStyle qui implémente un Expander contrôle.The example also defines a GroupStyle that implements an Expander control.

<ListView ItemsSource='{Binding Source={StaticResource src}}' 
          BorderThickness="0">
  <ListView.GroupStyle>
    <GroupStyle>
      <GroupStyle.ContainerStyle>
        <Style TargetType="{x:Type GroupItem}">
          <Setter Property="Margin" Value="0,0,0,5"/>
          <Setter Property="Template">
            <Setter.Value>
              <ControlTemplate TargetType="{x:Type GroupItem}">
                <Expander IsExpanded="True" BorderBrush="#FFA4B97F" 
                          BorderThickness="0,0,0,1">
                  <Expander.Header>
                    <DockPanel>
                      <TextBlock FontWeight="Bold" Text="{Binding Path=Name}" 
                                 Margin="5,0,0,0" Width="100"/>
                      <TextBlock FontWeight="Bold" 
                                 Text="{Binding Path=ItemCount}"/>
                    </DockPanel>
                  </Expander.Header>
                  <Expander.Content>
                    <ItemsPresenter />
                  </Expander.Content>
                </Expander>
              </ControlTemplate>
            </Setter.Value>
          </Setter>
        </Style>
      </GroupStyle.ContainerStyle>
    </GroupStyle>
  </ListView.GroupStyle>
</ListView>

Voir aussiSee also