Dela via

Så här gör du: Binda till en samling och visa information baserat på valet

  • Artikel

I ett enkelt huvudinformationsscenario har du en databunden ItemsControl till exempel en ListBox. Baserat på användarval visar du mer information om det markerade objektet. Det här exemplet visar hur du implementerar det här scenariot.

Exempel

I det här exemplet är People en ObservableCollection<T> av Person klasser. Den här Person-klassen innehåller tre egenskaper: FirstName, LastNameoch HomeTown, alla av typen 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 använder följande DataTemplate som definierar hur informationen i en Person visas:

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

Följande är en skärmbild av vad exemplet ger. I ContentControl visas de andra egenskaperna för den valda personen.

Bindning till en samling

De två saker som ska märkas i det här exemplet är:

  1. ListBox och ContentControl binder till samma källa. De Path egenskaperna för båda bindningarna anges inte eftersom båda kontrollerna är bundna till hela samlingsobjektet.

  2. Du måste ange egenskapen IsSynchronizedWithCurrentItem till true för att det ska fungera. Om du anger den här egenskapen ser du till att det markerade objektet alltid anges som CurrentItem. Alternativt, om ListBox hämtar data från en CollectionViewSource, synkroniseras markering och valuta automatiskt.

Observera att klassen Person åsidosätter metoden ToString på följande sätt. Som standard anropar ListBoxToString och visar en strängrepresentation av varje objekt i den bundna samlingen. Därför visas varje Person som ett förnamn i ListBox.

public override string ToString()
{
    return firstname.ToString();
}

Public Overrides Function ToString() As String
    Return Me._firstname.ToString
End Function

Se även