方法: コレクションにバインドして選択に基づく情報を表示する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

この例でPeopleは、ObservableCollection<T>Personクラス。In this example, People is an ObservableCollection<T> of Person classes. これは、Personクラスには、3 つのプロパティが含まれています: FirstNameLastName、および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

この例では、2 つの処理は次のとおりです。The two things to notice in this example are:

  1. ListBoxContentControlを同じソースにバインドします。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