Практическое руководство. Выполнение привязки к коллекции и вывод сведений в зависимости от выделенного элемента

Рассмотрим простой скрипт с отношением «главный-подчиненный», в котором имеется объект ItemsControl с привязкой данных, например, элемент управления ListBox. В зависимости от выбора пользователя можно отобразить дополнительные сведения о выбранном элементе. В данном примере показано, как реализовать этот скрипт.

Пример

В данном примере People является объектом ObservableCollection<T> классов Person. Данный класс Person содержит три свойства: FirstName, LastName и HomeTown. Все свойства являются типом string.

<Window x:Class="SDKSample.Window1"
  xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="https://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:

<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>

Ниже приведен снимок экрана с результатом выполнения примера. Объект ContentControl отображает другие свойства выбранного лица.

Привязка к коллекции

В данном примере следует обратить внимание на два обстоятельства:

  1. ListBox и ContentControl привязаны к одному источнику. Свойства Path обеих привязок не заданы, так как оба элемента управления привязаны к объекту коллекции.

  2. Для правильной работы необходимо задать для свойства IsSynchronizedWithCurrentItem значение true. Установка этого свойства гарантирует, что выбранный элемент всегда задается как свойство CurrentItem. Альтернативно, если ListBox получает данные от CollectionViewSource, то он автоматически синхронизирует выбор и денежные единицы.

Обратите внимание, что класс Person переопределяет метод ToString следующим образом. По умолчанию ListBox вызывает метод ToString и отображает строковое представление каждого объекта в присоединенной коллекции. Поэтому каждый объект Person отображается как имя в ListBox.

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

См. также

Задачи

Практическое руководство. Использование шаблона "основной-подчиненный" с иерархическими данными

Практическое руководство. Использование шаблона "основной-подробности" с иерархическими данными XML

Основные понятия

Общие сведения о связывании данных

Общие сведения о шаблонах данных

Другие ресурсы

Практические руководства по привязке данных