[英]How to expose internal control's property to its parent UserControl in WPF
I have a DialogPrompt UserControl that will have an Image and a TextBlock. 我有一个DialogPrompt UserControl,它将具有一个Image和一个TextBlock。 Here is the template:
这是模板:
<UserControl>
<Button x:Name="_OkButton" Content="OK"/>
<DockPanel >
<Image/>
<TextBlock x:Name="_DialogTextBox" />
</DockPanel>
</UserControl>
How do I expose Source property of the Image and Text property of the TextBlock inside my UserControl? 如何在UserControl中公开TextBlock的Image和Text属性的Source属性?
I would create two DependencyProperties
, one for the Text
and one for the Image
Source
. 我将创建两个
DependencyProperties
,一个用于Text
,另一个用于Image
Source
。
The Image
Source
DependencyProperty
will automatically set the inner Image
control's source whenever it is updated. 无论何时更新,
Image
Source
DependencyProperty
都会自动设置内部Image
控件的源。 Similarly, the Text
DependencyProperty
will be setting the Text
of the inner TextBlock
control as well. 同样,
Text
DependencyProperty
也将设置内部TextBlock
控件的Text
。
Here is the setup: 这是设置:
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);
}
}
}
Whenever the Image
Source
changes, this will automatically update the source of the inner Image
control. 每当
Image
Source
发生变化时,这将自动更新内部Image
控件的源。 Note, we need to do some conversion here since the Image
control itself uses an ImageSource
type. 注意,我们需要在这里做一些转换,因为
Image
控件本身使用ImageSource
类型。
XAML can then be updated to: 然后可以将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>
Here, the inner TextBlock
control simply binds to the Text
DependencyProperty
of the parent (the main UserControl
). 这里,内部
TextBlock
控件简单地绑定到父(主UserControl
)的Text
DependencyProperty
。
In your code behind, add 2 DependencyProperties and bind them to your Image Source and to your TextBlock Text. 在你的代码中,添加2个DependencyProperties并将它们绑定到Image Source和TextBlock Text。
Here is a tutorial on how to use and create Dependency Properties : http://www.wpftutorial.net/dependencyproperties.html 以下是有关如何使用和创建依赖项属性的教程: http : //www.wpftutorial.net/dependencyproperties.html
For your binding in your xaml, here is an example : 对于你在xaml中的绑定,这是一个例子:
<Image Source="{Binding YourProperty, RelativeSource={RelativeSource FindAncestor, AncestorType=YourUserControl}}/>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.