通过UserControls WPF数据绑定

Question

我想从主窗口的DataContext绑定属性，上面你可以看到我的UserControls和模型。所以我想将Model.ID.Label1和Model.ID.Label2属性绑定到main_id/card_1/top和main_id/card_1/bottom控件。我希望这很清楚。如果我启用了 ref_lbl标签，它将显示“lbl1”，card_2仍在使用硬编码文本，但card_1将为空白。我应该修改什么来修复card_1上的绑定？

我有一个ID用户控件，它包含另一个用户控件。

XAML：

<UserControl x:Class="stack.ID" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
     xmlns:Controls="clr-namespace:stack.Controls" 
     mc:Ignorable="d" 
     d:DesignHeight="300" d:DesignWidth="300"> 
<Grid> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="1*" /> 
     <RowDefinition Height="1*" /> 
    </Grid.RowDefinitions> 
    <Label Name="ref_lbl" Grid.Row="0" Content="{Binding Label1}" Visibility="Collapsed" /> 
    <Controls:Card x:Name="card_1" Grid.Row="0" TopLabel="{Binding Label1}" BottomLabel="{Binding Label2}" /> 
    <Controls:Card x:Name="card_2" Grid.Row="1" TopLabel="Text 1" BottomLabel="Text 2" /> 
</Grid> 

代码背后：默认情况下，自动生成的

这里是卡用户控件。

XAML：

<UserControl x:Class="stack.Controls.Card" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
     mc:Ignorable="d" 
     d:DesignHeight="300" d:DesignWidth="300" DataContext="{Binding RelativeSource={RelativeSource Self}}"> 
<Grid> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="1*" /> 
     <RowDefinition Height="1*" /> 
    </Grid.RowDefinitions> 
    <Label Grid.Row="0" FontSize="20" Foreground="Black" HorizontalAlignment="Center" VerticalAlignment="Center" Content="{Binding TopLabel}" /> 
    <Label Grid.Row="1" FontSize="20" Foreground="Black" HorizontalAlignment="Center" VerticalAlignment="Center" Content="{Binding BottomLabel}" /> 
</Grid> 

代码背后：

namespace stack.Controls 
{ 
    public partial class Card : UserControl 
    { 
     public static readonly DependencyProperty TopLabelProperty = DependencyProperty.Register("TopLabel", typeof(string), typeof(Card), new PropertyMetadata(default(string))); 
     public static readonly DependencyProperty BottomLabelProperty = DependencyProperty.Register("BottomLabel", typeof(string), typeof(Card), new PropertyMetadata(default(string))); 
     public Card() 
     { 
      InitializeComponent(); 
     } 
     public string TopLabel 
     { 
      get 
      { 
       return (string)GetValue(TopLabelProperty); 
      } 
      set 
      { 
       SetValue(TopLabelProperty, value); 
      } 
     } 
     public string BottomLabel 
     { 
      get 
      { 
       return (string)GetValue(BottomLabelProperty); 
      } 
      set 
      { 
       SetValue(BottomLabelProperty, value); 
      } 
     } 
    } 
} 

这里是我的主窗口。

XAML：

<Window x:Class="stack.MainWindow" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:local="clr-namespace:stack" 
    Title="MainWindow" Height="350" Width="525"> 
<Window.DataContext> 
    <local:Model /> 
</Window.DataContext> 
<Grid> 
    <local:ID x:Name="main_id" DataContext="{Binding ID}" /> 
</Grid> 

代码背后：默认情况下，自动生成的

而且我也有2款。

namespace stack 
{ 
    public class IDModel 
    { 
     private string label1 = "lbl1"; 
     private string label2 = "lbl2"; 
     public string Label1 
     { 
      get 
      { 
       return label1; 
      } 
      set 
      { 
       label1 = value; 
      } 
     } 
     public string Label2 
     { 
      get 
      { 
       return label2; 
      } 
      set 
      { 
       label2 = value; 
      } 
     } 
    } 
    public class Model 
    { 
     private IDModel id = new IDModel(); 
     public IDModel ID 
     { 
      get 
      { 
       return id; 
      } 
      set 
      { 
       id = value; 
      } 
     } 
    } 
} 

Answer 1

从Card的XAML删除

DataContext="{Binding RelativeSource={RelativeSource Self}}" 

。

它可以防止从其父ID控制，当你写

<Controls:Card ... TopLabel="{Binding Label1}" /> 

而是写在Card的XAML这样的Content绑定这是必要继承的DataContext：

<Label ... Content="{Binding TopLabel, 
    RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=UserControl}}" />