How to change a WPF GroupBox Header on re-used UserControl - wpf

Question

I am looking for a way to change the header on a re-used user control from the containing XAML.
User Control:
<UserControl x:Class="ReusableControl"
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="150" d:DesignWidth="300">
<Grid>
<GroupBox Header="Config Number">
<Grid Name="MyConfig">
<Grid.RowDefinitions>
<RowDefinition Height="60" />
<RowDefinition Height="60" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="80" />
<ColumnDefinition Width="*" MinWidth="100"/>
</Grid.ColumnDefinitions>
<Label Name="Value1Label" Grid.Row="0" Grid.Column="0" VerticalAlignment="Center" HorizontalAlignment="Left">Value 1</Label>
<TextBox Grid.Row="0" Grid.Column="1"
HorizontalContentAlignment="Left" VerticalContentAlignment="Center"
IsEnabled="True" Margin="5,5,5,5">
<TextBox.Text>
<Binding Path="Value1" StringFormat="{}{0:0.0#######}" Mode="TwoWay" UpdateSourceTrigger="PropertyChanged" ValidatesOnDataErrors="True" />
</TextBox.Text>
</TextBox>
<Label Name="Value2Label" Grid.Row="1" Grid.Column="0" VerticalAlignment="Center" HorizontalAlignment="Left">Value 2</Label>
<TextBox Grid.Row="1" Grid.Column="1"
HorizontalContentAlignment="Left" VerticalContentAlignment="Center"
IsEnabled="True" Margin="5,5,5,5">
<TextBox.Text>
<Binding Path="Value2" StringFormat="{}{0:0.0#######}" Mode="TwoWay" UpdateSourceTrigger="PropertyChanged" ValidatesOnDataErrors="True" />
</TextBox.Text>
</TextBox>
</Grid>
</GroupBox>
</Grid>
Containing Window:
<Window x:Class="MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:StackExchangeQuestion"
Title="MainWindow" Height="500" Width="525">
<Grid>
<StackPanel Orientation="Vertical">
<local:ReusableControl x:Name="Config1" />
<local:ReusableControl x:Name="Config2" />
<local:ReusableControl x:Name="Config3" />
</StackPanel>
</Grid>
The intent being so that the successive controls say "Config 1", "Config 2", Config 3", rather than "Config Number" three times.
Thanks in advance for the help!

Answer 1

In your ReusableControl.xaml.cs define a DependencyProperty like this:
public string Header
{
get { return (string)GetValue(HeaderProperty); }
set { SetValue(HeaderProperty, value); }
}
public static readonly DependencyProperty HeaderProperty =
DependencyProperty.Register("Header",
typeof(string), typeof(ReusableControl));
Now you can use this Header property as source of a Binding for the Header property of the internal GroupBox:
<GroupBox Header="{Binding Header,
RelativeSource={RelativeSource AncestorType=local:ReusableControl}}">
Now you will see that this:
<StackPanel Orientation="Vertical">
<local:ReusableControl x:Name="Config1" Header="Config 1"/>
<local:ReusableControl x:Name="Config2" Header="Config 2"/>
<local:ReusableControl x:Name="Config3" Header="Config 3"/>
</StackPanel>