如何在 WPF 中将内部控件的属性公开给其父 UserControl答案

【问题标题】：How to expose internal control's property to its parent UserControl in WPF如何在 WPF 中将内部控件的属性公开给其父 UserControl
【发布时间】：2015-07-26 05:50:05
【问题描述】：

我有一个 DialogPrompt UserControl，它有一个 Image 和一个 TextBlock。这是模板：

    <UserControl>   
      <Button x:Name="_OkButton" Content="OK"/>
      <DockPanel >
        <Image/>
        <TextBlock x:Name="_DialogTextBox" />
      </DockPanel>
    </UserControl>

如何在我的 UserControl 中公开 TextBlock 的 Image 和 Text 属性的 Source 属性？

【问题讨论】：

标签： wpf xaml properties user-controls

【解决方案1】：

在您后面的代码中，添加 2 个 DependencyProperties 并将它们绑定到您的图像源和您的 TextBlock 文本。

这是一个关于如何使用和创建依赖属性的教程： http://www.wpftutorial.net/dependencyproperties.html

对于您在 xaml 中的绑定，这是一个示例：

<Image Source="{Binding YourProperty, RelativeSource={RelativeSource FindAncestor, AncestorType=YourUserControl}}/>

【讨论】：

+1 表示第一个正确答案，但是@d.moncada 的答案要好得多，因为它包含更详细的解释（而不仅仅是一个链接）

【解决方案2】：

我会创建两个DependencyProperties，一个用于Text，一个用于ImageSource。

Image Source DependencyProperty 将在更新时自动设置内部 Image 控件的源。同样，TextDependencyProperty 也将设置内部TextBlock 控件的Text。

设置如下：

public partial class MyUserControl : UserControl
{
    #region ImageSource
    public static readonly DependencyProperty ImageSourceProperty = 
        DependencyProperty.Register
        ( 
            "ImageSource", 
            typeof(Uri),
            typeof(MyUserControl), 
            new FrameworkPropertyMetadata(new PropertyChangedCallback(OnImageSourceChanged))
        );

    public Uri ImageSource
    {
        get { return (Uri)GetValue(ImageSourceProperty); }
        set { SetValue(ImageSourceProperty, value); }
    }
    #endregion ImageSource

    #region Text
    public static readonly DependencyProperty TextProperty = 
        DependencyProperty.Register
        ( 
            "Text", 
            typeof(string),
            typeof(MyUserControl), 
            new FrameworkPropertyMetadata("")
        );

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

    public MyUserControl()
    {
        InitializeComponent();
    }

    private static void OnImageSourceChanged(DependencyObject sender, DependencyPropertyChangedEventArgs e)
    {
        var myUserControl = sender as MyUserControl;
        if (myUserControl != null)
        {
            myUserControl.ImageSource.Source = new BitmapImage((Uri) e.NewValue);
        }
    }
}

每当Image Source 更改时，这将自动更新内部Image 控件的源。注意，由于Image 控件本身使用ImageSource 类型，因此我们需要在此处进行一些转换。

XAML 然后可以更新为：

   <UserControl x:Name="ControlName">   
      <Button x:Name = "OkButton" Content="OK"/>
      <DockPanel >
        <Image x:Name = "MyImage" />
        <TextBlock x:Name = "DialogTextBox" Text="{Binding ElementName=ControlName, Path=Text}"/>
      </DockPanel>
    </UserControl>

这里，内部TextBlock 控件只是绑定到父级的Text DependencyProperty（主UserControl）。

【讨论】：