web-dev-qa-db-fra.com

Quelle est la différence entre ItemTemplate et ItemContainerStyle dans un WPF ListBox?

Dans WPF Listbox, je suis confondu avec ces 2 notions: ItemTemplate et ItemContainerStyle Quelqu'un peut-il m'expliquer davantage?

41
RHaguiuda

ItemTemplate permet de définir l'apparence du contenu de votre élément de données. Vous l'utilisez pour lier des champs de données, formater des chaînes d'affichage, etc. Il détermine la façon dont les données sont présentées.

ItemContainerStyle sert à styliser le conteneur de l'élément de données. Dans une zone de liste, ce serait un ListBoxItem. Le style ici affecte des choses comme le comportement de sélection ou la couleur d'arrière-plan. Il détermine le style et l'UX de l'affichage.

La page MSDN pour ItemContainerStyle, liée ci-dessus, a un assez bon exemple montrant quelques différences:

 <!--Use the ItemTemplate to set a DataTemplate to define
      the visualization of the data objects. This DataTemplate
      specifies that each data object appears with the Proriity
      and TaskName on top of a silver ellipse.-->
  <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="3,3,3,0"
                     Text="{Binding Path=Priority}"/>
          <TextBlock Margin="3,0,3,7"
                     Text="{Binding Path=TaskName}"/>
        </StackPanel>
      </Grid>
    </DataTemplate>
  </ItemsControl.ItemTemplate>
  <!--Use the ItemContainerStyle property to specify the appearance
      of the element that contains the data. This ItemContainerStyle
      gives each item container a margin and a width. There is also
      a trigger that sets a tooltip that shows the description of
      the data object when the mouse hovers over the item container.-->
  <ItemsControl.ItemContainerStyle>
    <Style>
      <Setter Property="Control.Width" Value="100"/>
      <Setter Property="Control.Margin" Value="5"/>
      <Style.Triggers>
        <Trigger Property="Control.IsMouseOver" Value="True">
          <Setter Property="Control.ToolTip"
                  Value="{Binding RelativeSource={x:Static RelativeSource.Self},
                          Path=Content.Description}"/>
        </Trigger>
      </Style.Triggers>
    </Style>
  </ItemsControl.ItemContainerStyle>
41

ItemContainerStyle est simplement un wrapper pour le DataTemplate afin qu'un style d'élément commun puisse être appliqué à différentes dispositions de données.

Aussi, à partir de cette réponse à "DataTemplate vs ItemContainerStyle" :

Vous pouvez faire tout votre style dans le ItemTemplate mais le ItemContentStyle a des VisualStates qui contrôlent l'opacité au passage de la souris/désactivé/sélectionné, etc.

Si vous souhaitez modifier ces changements d'état d'opacité, ou si vous souhaitez une forme de conteneur autre qu'un rectangle, comme un triangle par exemple, vous devrez remplacer le ItemContainerStyle par défaut.

9
Jeff