Практическое руководство. Привязка к коллекции и вывод сведений в зависимости от выделенного элементаHow to: Bind to a Collection and Display Information Based on Selection

В простом сценарии «основной-подробности», у вас есть привязкой к данным ItemsControl например ListBox.In a simple master-detail scenario, you have a data-bound ItemsControl such as a ListBox. В зависимости от выбора пользователя можно отобразить дополнительные сведения о выбранном элементе.Based on user selection, you display more information about the selected item. В этом примере показано, как реализовать этот сценарий.This example shows how to implement this scenario.

ПримерExample

В этом примере PeopleObservableCollection<T> из Person классы.In this example, People is an ObservableCollection<T> of Person classes. Это Person класс содержит три свойства: FirstName, LastName, и HomeTown, все типа 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>

ContentControl Использует следующие DataTemplate определяет, как данные Person представлены: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>

Ниже приведен снимок экрана примера.The following is a screenshot of what the example produces. ContentControl Показаны другие свойства выбранного лица.The ContentControl shows the other properties of the person selected.

Привязка к коллекцииBinding to a collection

В этом примере следует обратить внимание на два обстоятельства:The two things to notice in this example are:

  1. ListBox И ContentControl привязать к одному источнику.The ListBox and the ContentControl bind to the same source. Path Свойства обе привязки не заданы, так как оба элемента управления привязаны к всему объекту коллекции.The Path properties of both bindings are not specified because both controls are binding to the entire collection object.

  2. Необходимо задать IsSynchronizedWithCurrentItem свойства true для правильной работы.You must set the IsSynchronizedWithCurrentItem property to true for this to work. Задание этого свойства гарантирует, что выбранный элемент всегда задается как CurrentItem.Setting this property ensures that the selected item is always set as the CurrentItem. Кроме того Если ListBox получает данные от CollectionViewSource, он автоматически синхронизирует Выбор и денежные единицы.Alternatively, if the ListBox gets it data from a CollectionViewSource, it synchronizes selection and currency automatically.

Обратите внимание, что Person класса переопределения ToString метод следующим образом.Note that the Person class overrides the ToString method the following way. По умолчанию ListBox вызовы ToString и отображает строковое представление каждого объекта в привязанной коллекции.By default, the ListBox calls ToString and displays a string representation of each object in the bound collection. Вот почему каждый Person отображается как имя в 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

См. такжеSee also