Comment : lier les propriétés de deux contrôlesHow to: Bind the Properties of Two Controls

Cet exemple montre comment lier la propriété d’un contrôle instancié à celle d’un autre à l’aide de la propriété ElementName.This example shows how to bind the property of one instantiated control to that of another using the ElementName property.

ExempleExample

L’exemple suivant montre comment lier la propriété Background d’un Canvas au SelectedItem.ContentThe following example shows how to bind the Background property of a Canvas to the SelectedItem.Content propriété d’un ComboBox:property of a ComboBox:

<Window
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  Width="460" Height="200"
  Title="Binding the Properties of Two Controls">

  <Window.Resources>
    <Style TargetType="TextBlock">
      <Setter Property="FontSize" Value="16"/>
      <Setter Property="FontWeight" Value="Bold"/>
      <Setter Property="DockPanel.Dock" Value="Top"/>
      <Setter Property="HorizontalAlignment" Value="Center"/>
    </Style>
    <Style TargetType="Canvas">
      <Setter Property="Height" Value="50"/>
      <Setter Property="Width" Value="50"/>
      <Setter Property="Margin" Value="8"/>
      <Setter Property="DockPanel.Dock" Value="Top"/>
    </Style>
    <Style TargetType="ComboBox">
      <Setter Property="Width" Value="150"/>
      <Setter Property="Margin" Value="8"/>
      <Setter Property="DockPanel.Dock" Value="Top"/>
    </Style>
  </Window.Resources>

  <Border Margin="10" BorderBrush="Silver" BorderThickness="3" Padding="8">
    <DockPanel>
      <TextBlock>Choose a Color:</TextBlock>
      <ComboBox Name="myComboBox" SelectedIndex="0">
        <ComboBoxItem>Green</ComboBoxItem>
        <ComboBoxItem>Blue</ComboBoxItem>
        <ComboBoxItem>Red</ComboBoxItem>
      </ComboBox>
      <Canvas>
        <Canvas.Background>
          <Binding ElementName="myComboBox" Path="SelectedItem.Content"/>
        </Canvas.Background>
      </Canvas>
    </DockPanel>
  </Border>
</Window>

Lors de l’affichage, on obtient un résultat similaire à ce qui suit :When this example is rendered it looks like the following:

Capture d’écran montrant une zone de liste modifiable avec la valeur vert sélectionnée et un carré vert.

Notes

La propriété de la cible de liaison (dans cet exemple, la propriété Background) doit être une propriété de dépendance.The binding target property (in this example, the Background property) must be a dependency property. Pour plus d’informations, consultez Vue d’ensemble de la liaison de données.For more information, see Data Binding Overview.

Voir aussiSee also