Share via


방법: 선택에 따라 수집 및 표시 정보에 바인딩

업데이트: 2007년 11월

간단한 마스터-세부 시나리오에서는 ListBox와 같은 데이터 바인딩된 ItemsControl을 사용합니다. 사용자가 선택하는 내용에 따라 선택된 항목에 대한 추가 정보를 표시합니다. 이 예제에서는 이 시나리오를 구현하는 방법을 보여 줍니다.

예제

이 예제에서 People은 Person 클래스의 ObservableCollection<T>입니다. 이 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은 Person의 정보가 제공되는 방식을 정의하는 다음 DataTemplate을 사용합니다.

<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. ListBoxContentControl은 같은 소스에 바인딩됩니다. 두 컨트롤 모두 전체 컬렉션 개체에 대한 바인딩이므로 두 바인딩의 Path 속성은 지정되지 않습니다.

  2. 이 시나리오가 제대로 작동하기 위해서는 IsSynchronizedWithCurrentItem 속성을 true로 설정해야 합니다. 이 속성을 설정하면 선택한 항목이 항상 CurrentItem으로 설정됩니다. ListBoxCollectionViewSource에서 데이터를 가져오는 경우에는 선택 항목과 통화가 자동으로 동기화됩니다.

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 데이터에 마스터-세부 패턴 사용

개념

데이터 바인딩 개요

데이터 템플릿 개요

기타 리소스

데이터 바인딩 샘플

데이터 바인딩 방법 항목