Procédure : Effectuer une liaison à une collection et afficher des informations basées sur la sélectionHow to: Bind to a Collection and Display Information Based on Selection

Dans un scénario maître / détail simple, vous avez lié aux données ItemsControl comme un ListBox.In a simple master-detail scenario, you have a data-bound ItemsControl such as a ListBox. En fonction de sélection de l’utilisateur, afficher plus d’informations sur l’élément sélectionné.Based on user selection, you display more information about the selected item. Cet exemple montre comment implémenter ce scénario.This example shows how to implement this scenario.

ExempleExample

Dans cet exemple, People est un ObservableCollection<T> de Person classes.In this example, People is an ObservableCollection<T> of Person classes. Cela Person classe contient trois propriétés : FirstName, LastName, et HomeTown, tous du type string.This Person class contains three properties: FirstName, LastName, and HomeTown, all of type string.

<Window x:Class="SDKSample.Window1"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:local="clr-namespace:SDKSample"
  Title="Binding to a Collection"
  SizeToContent="WidthAndHeight">
  <Window.Resources>
    <local:People x:Key="MyFriends"/>
  </Window.Resources>

  <StackPanel>
    <TextBlock FontFamily="Verdana" FontSize="11"
               Margin="5,15,0,10" FontWeight="Bold">My Friends:</TextBlock>
    <ListBox Width="200" IsSynchronizedWithCurrentItem="True"
             ItemsSource="{Binding Source={StaticResource MyFriends}}"/>
    <TextBlock FontFamily="Verdana" FontSize="11"
               Margin="5,15,0,5" FontWeight="Bold">Information:</TextBlock>
    <ContentControl Content="{Binding Source={StaticResource MyFriends}}"
                    ContentTemplate="{StaticResource DetailTemplate}"/>
  </StackPanel>
</Window>

Le ContentControl utilise les éléments suivants DataTemplate qui définit comment les informations d’un Person est présenté :The ContentControl uses the following DataTemplate that defines how the information of a Person is presented:

<DataTemplate x:Key="DetailTemplate">
  <Border Width="300" Height="100" Margin="20"
          BorderBrush="Aqua" BorderThickness="1" Padding="8">
    <Grid>
      <Grid.RowDefinitions>
        <RowDefinition/>
        <RowDefinition/>
        <RowDefinition/>
      </Grid.RowDefinitions>
      <Grid.ColumnDefinitions>
        <ColumnDefinition/>
        <ColumnDefinition/>
      </Grid.ColumnDefinitions>
      <TextBlock Grid.Row="0" Grid.Column="0" Text="First Name:"/>
      <TextBlock Grid.Row="0" Grid.Column="1" Text="{Binding Path=FirstName}"/>
      <TextBlock Grid.Row="1" Grid.Column="0" Text="Last Name:"/>
      <TextBlock Grid.Row="1" Grid.Column="1" Text="{Binding Path=LastName}"/>
      <TextBlock Grid.Row="2" Grid.Column="0" Text="Home Town:"/>
      <TextBlock Grid.Row="2" Grid.Column="1" Text="{Binding Path=HomeTown}"/>
    </Grid>
  </Border>
</DataTemplate>

Voici une capture d’écran de ce que l’exemple se produit.The following is a screenshot of what the example produces. Le ContentControl présente les autres propriétés de la personne sélectionnée.The ContentControl shows the other properties of the person selected.

Liaison à une collectionBinding to a collection

Les deux choses à noter dans cet exemple sont :The two things to notice in this example are:

  1. Le ListBox et ContentControl lier à la même source.The ListBox and the ContentControl bind to the same source. Le Path propriétés des deux liaisons ne sont pas spécifiées, car les deux contrôles sont une liaison à l’objet d’ensemble de la collection.The Path properties of both bindings are not specified because both controls are binding to the entire collection object.

  2. Vous devez définir le IsSynchronizedWithCurrentItem propriété true pour ce faire.You must set the IsSynchronizedWithCurrentItem property to true for this to work. Définition de cette propriété garantit que l’élément sélectionné est toujours défini en tant que le CurrentItem.Setting this property ensures that the selected item is always set as the CurrentItem. Ou bien, si le ListBox obtient ses données à partir d’un CollectionViewSource, il synchronise automatiquement sélection et la devise.Alternatively, if the ListBox gets it data from a CollectionViewSource, it synchronizes selection and currency automatically.

Notez que le Person substitue le ToString méthode la façon suivante.Note that the Person class overrides the ToString method the following way. Par défaut, le ListBox appels ToString et affiche une représentation sous forme de chaîne de chaque objet dans la collection liée.By default, the ListBox calls ToString and displays a string representation of each object in the bound collection. C’est pourquoi chaque Person apparaît sous la forme d’un prénom dans le ListBox.That is why each Person appears as a first name in the ListBox.

public override string ToString()
{
    return firstname.ToString();
}
Public Overrides Function ToString() As String
    Return Me._firstname.ToString
End Function

Voir aussiSee also