将WPF用户控件绑定到父属性

Question

我有一个包含图片我想改变基于父属性（也可以是另一个UC或窗口），其源一个简单的用户控制。在UC的简化版本看起来是这样的

<UserControl x:Class="Test.Controls.DualStateButton" ... x:Name="root">
    <Grid>
        <Image Height="{Binding Height, ElementName=root}" Stretch="Fill" Width="{Binding Width, ElementName=root}">
            <Image.Style>
                <Style TargetType="{x:Type Image}">
                    <Setter Property="Source" Value="{Binding ImageOff, ElementName=root}"/>
                    <Style.Triggers>
                        <DataTrigger Binding="{Binding State}" Value="True">
                            <Setter Property="Source" Value="{Binding ImageOn, ElementName=root}"/>
                        </DataTrigger>
                    </Style.Triggers>
                </Style>
            </Image.Style>
        </Image>
    </Grid>
</UserControl>

高度，宽度，ImageOff，ImageOn和State都是UC上的依赖项属性。UC没有设置DataContext，因此它应该继承父级。我正在试图做的是一样的东西，其中在UC国家势必窗口DualState属性如下。

<Window x:Class="Test.MainWindow" DataContext="{Binding RelativeSource={RelativeSource Self}}">
...
    <Grid>
        <local:DualStateButton State="{Binding DualState}" Height="100" ImageOff="{StaticResource ButtonUp}" ImageOn="{StaticResource ButtonDown}" Width="100"/>
    </Grid>
</Window>

我能得到什么，但是，是一个错误，说在“对象”“”主窗口没有发现“国家”财产”，所以它似乎正在结合‘国家’在UC字面上，而不是将其分配到的DualState财产窗户。有人能阐明什么，我做错了一些见解？

如果我设置在UC的国有资产既可以通过代码或XAML（为bool值），它工作正常。国家DP定义如下。

public static readonly DependencyProperty StateProperty =
    DependencyProperty.Register("State", typeof(bool), typeof(DualStateButton),
    new PropertyMetadata(false));

public bool State
{
    get { return (bool)GetValue(StateProperty); }
    set { SetValue(StateProperty, value); }
}

它的数据类型是否需要绑定或某种绑定才能起作用？

Answer 1

DataTrigger的DataContext设置为窗口，这就是为什么它在窗口中查看“状态”的原因。您只需要告诉绑定状态在用户控件上即可。尝试这个：

<DataTrigger Binding="{Binding Path=State, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=UserControl}}" Value="True">

这是一个完整的示例：

MainWindow.xaml

<Window x:Class="WpfApplication89.MainWindow"
        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:local="clr-namespace:WpfApplication89"
        mc:Ignorable="d"
        DataContext="{Binding RelativeSource={RelativeSource Self}}"
        Title="MainWindow" Height="350" Width="525">
    <StackPanel>
        <local:UserControl1 State="{Binding Path=DualState}" />
        <CheckBox Content="DualState" IsChecked="{Binding DualState}" />
    </StackPanel>
</Window>

MainWindow.xaml.cs

using System.Windows;

namespace WpfApplication89
{
    public partial class MainWindow : Window
    {
        public static readonly DependencyProperty DualStateProperty = DependencyProperty.Register("DualState", typeof(bool), typeof(MainWindow), new PropertyMetadata(false));

        public bool DualState
        {
            get { return (bool)GetValue(DualStateProperty); }
            set { SetValue(DualStateProperty, value); }
        }

        public MainWindow()
        {
            InitializeComponent();
        }
    }
}

UserControl1.xaml

<UserControl x:Class="WpfApplication89.UserControl1"
             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:local="clr-namespace:WpfApplication89"
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300">
    <Grid>
        <TextBlock Text="User Control 1">
            <TextBlock.Style>
                <Style TargetType="TextBlock">
                    <Setter Property="Background" Value="Beige" />
                    <Style.Triggers>
                        <DataTrigger Binding="{Binding Path=State, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=UserControl}}" Value="true">
                            <Setter Property="Background" Value="Red" />
                        </DataTrigger>
                    </Style.Triggers>
                </Style>
            </TextBlock.Style>
        </TextBlock>
    </Grid>
</UserControl>

UserControl1.xaml.cs

using System.Windows;
using System.Windows.Controls;

namespace WpfApplication89
{
    public partial class UserControl1 : UserControl
    {
        public static readonly DependencyProperty StateProperty = DependencyProperty.Register("State", typeof(bool), typeof(UserControl1), new PropertyMetadata(false));

        public bool State
        {
            get { return (bool)GetValue(StateProperty); }
            set { SetValue(StateProperty, value); }
        }

        public UserControl1()
        {
            InitializeComponent();
        }
    }
}

MainWindow.xaml.cs（INotifyPropertyChanged版本）

using System.ComponentModel;
using System.Runtime.CompilerServices;
using System.Windows;

namespace WpfApplication89
{
    public partial class MainWindow : Window, INotifyPropertyChanged
    {

        #region INotifyPropertyChanged
        public event PropertyChangedEventHandler PropertyChanged;
        protected bool SetProperty<T>(ref T field, T value, [CallerMemberName]string name = null)
        {
            if (Equals(field, value))
            {
                return false;
            }
            field = value;
            this.OnPropertyChanged(name);
            return true;
        }
        protected void OnPropertyChanged([CallerMemberName]string name = null)
        {
            var handler = this.PropertyChanged;
            handler?.Invoke(this, new PropertyChangedEventArgs(name));
        }
        #endregion

        #region Property bool DualState
        private bool _DualState;
        public bool DualState { get { return _DualState; } set { SetProperty(ref _DualState, value); } }
        #endregion


        public MainWindow()
        {
            InitializeComponent();
        }
    }
}