プロパティバインディングを使用したカスタムUserControlテンプレート

Question

楕円とラベルを含むカスタムUserControlを作成しました。ラベルコンテンツと楕円の色はバインドされています。 バインディングプロパティはDependencyPropertiesです。楕円の 色を

（コンバータカラーを作成）BOOLされた状態、に依存しているこれはUserControl1.xamlある：

<UserControl x:Class="Plugin_UPS.Views.UserControl1" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    xmlns:Converters="clr-namespace:WPF_Prism.Infrastructure.Converters.Ups;assembly=WPF_Prism.Infrastructure" 
    mc:Ignorable="d" 
    x:Name="UC1" 
    d:DesignWidth="200" Height="40"> 

<UserControl.Resources> 
    <ResourceDictionary> 
     <Converters:BoolToColorConverter x:Key="BoolToColorConverter"/> 
    </ResourceDictionary> 
</UserControl.Resources> 

<Grid x:Name="LayoutRoot" Height="42" Width="504">  
     <StackPanel HorizontalAlignment="Left" Margin="0,0,0,0" Height="Auto" Width="Auto" Grid.Column="0" Grid.Row="0"> 
      <Grid Height="Auto" Width="Auto" HorizontalAlignment="Left" VerticalAlignment="Center" Margin="0,0,0,0" 
          MinWidth="200" MaxWidth="200" MinHeight="35" MaxHeight="40"> 
       <Grid.RowDefinitions> 
        <RowDefinition Height="*" /> 
       </Grid.RowDefinitions> 
       <Grid.ColumnDefinitions> 
        <ColumnDefinition Width="20" /> 
        <ColumnDefinition Width="*" /> 
       </Grid.ColumnDefinitions> 
       <Ellipse HorizontalAlignment="Left" VerticalAlignment="Center" Grid.Column="0" Grid.Row="0" 
             Fill="{Binding Status, Converter={StaticResource BoolToColorConverter}, UpdateSourceTrigger=PropertyChanged}" 
             Height="15" 
             Width="15" 
             StrokeThickness="1" 
             Stroke="Black"> 
       </Ellipse> 
       <Label Content="{Binding Text}" Height="Auto" Width="Auto" Margin="0,0,0,0" HorizontalAlignment="Left" VerticalAlignment="Center" FontSize="16" Grid.Column="1" Grid.Row="0" /> 
      </Grid> 
     </StackPanel> 
</Grid> 

</UserControl> 

これはUserControl1.xaml.csあります。

namespace Plugin_UPS.Views 
{ 
public partial class UserControl1 : UserControl 
{ 
    public UserControl1() 
    { 
     InitializeComponent(); 
    } 

    public string Text 
    { 
     get { return (string)GetValue(TextProperty); } 
     set { SetValue(TextProperty, value); } 
    } 

    public static readonly DependencyProperty TextProperty = 
     DependencyProperty.Register("Text", typeof(string), typeof(UserControl1)); 


    public bool Status 
    { 
     get { return (bool)GetValue(StatusProperty); } 
     set { SetValue(StatusProperty, value); } 
    } 

    public static readonly DependencyProperty StatusProperty = 
     DependencyProperty.Register("Status", typeof(bool), typeof(UserControl1)); 
} 
} 

これは私のUPSViewModel.csです：

namespace Plugin_UPS.ViewModel 
{ 
public class UPSViewModel 
{  
    public UPSViewModel() 
    { 
    } 

    public string UpsModelText { get { return "Model"; } } 

    private bool replaceBatteryCondition; 
    public bool ReplaceBatteryCondition { get { return replaceBatteryCondition; } set { replaceBatteryCondition = value; } } 
} 
} 

これをm Y UPSView.xaml： は（ここで私はのUserControl1を実装）

<UserControl x:Class="Plugin_UPS.Views.UPSView" 
     x:Name="UPSUC" 
     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:i="http://schemas.microsoft.com/expression/2010/interactivity" 
     xmlns:scm="clr-namespace:System.ComponentModel;assembly=WindowsBase" 
     xmlns:local="clr-namespace:Plugin_UPS" 
     xmlns:Controls="clr-namespace:WPF_Prism.Controls.Controls;assembly=WPF_Prism.Controls" 
     xmlns:ViewModel="clr-namespace:Plugin_UPS.ViewModel" 
     xmlns:Views="clr-namespace:Plugin_UPS.Views" 
     d:DataContext="{d:DesignInstance ViewModel:UPSViewModel}" 
     mc:Ignorable="d" 
     d:DesignHeight="840" d:DesignWidth="1260"> 

     <Grid> 

      <StackPanel> 
       <Views:UserControl1 Margin="10,20,10,10" DataContext="{Binding RelativeSource={RelativeSource Self}}" Text="{Binding UpsModelText}" Status="{Binding ReplaceBatteryCondition}"></Views:UserControl1> 
      </StackPanel> 

     </Grid> 
</UserControl> 

しかし、 "ステータス" と "テキスト" のバインディング機能していません。 （ステータス= "True"またはテキスト= "モデル"が動作しています）。

問題の原因は何ですか？ DataContextに問題はありますか？

よろしく フィル

Answer 1

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

によって行われるようにあなたは「その割り当てを削除し、今すぐあなたを

<Views:UserControl1 Margin="10,20,10,10" 
    Text="{Binding UpsModelText}" 
    Status="{Binding ReplaceBatteryCondition}" /> 

---

を書き、それ自体にUserControlのDataContextのを設定してはいけませんUserControlのXAMLでバインディングのソースを指定する必要があります。

そのうちの一つは、このようRelativeSourceプロパティを設定することで、それを行うために複数の方法がありますバインディング塗りつぶしにUpdateSourceTrigger=PropertyChangedを設定する意味がないことを

<Label Content="{Binding Text, 
       RelativeSource={RelativeSource AncestorType=UserControl}}" ... /> 

<Ellipse Fill="{Binding Status, 
       RelativeSource={RelativeSource AncestorType=UserControl}, 
       Converter={StaticResource BoolToColorConverter}}" ... /> 

注意。