Making a button content change within user control on click - wpf

Question

I realise that WPF is still a bucket of magic to me. The problem seems to be simple. I have a user control with a button. I would like to change the button content (text) on click.
If I open the form with user control without initialising the button value and then say in
void Button_Click(object sender, RoutedEventArgs e)
{
Button.Content = "New Value";
}
it works.
If I initialise the button value dynamically in the control constructor by Button.Content = "Init Value", the second bit Button.Content = "New Value"
never happens (it happens, but button text does not show the change ever again, at least that what it seems).
So I decided to use a binding. Declared ButtonText property in MyUserControl (+ the corresponding DependencyProperty with getter and setter) and tried to do ButtonText = "Init Value"; in constructor and ButtonText = "New Value"; in Button_Click(). The first one works, the second one still does not. I assume because of the wrong data context in Button_Click()?
In MyUserControl I tried a few things including
<Button x:Name="Button"
Content="{Binding Path=ButtonText, RelativeSource={RelativeSource AncestorType=UserControl}}"
Click="Button_Click" />
<Button x:Name="Button"
Content="{Binding Path=ButtonText, Element=MyUserControl}"
Click="Button_Click" />
and nothing seems to work.
What is the easiest way to achieve what I need, i.e. both dynamic initialisation and dynamic change? With an explanation, if possible, please, why my first (direct) approach does not work and what the binding approach is missing.
Thanks a lot!
EDIT:
An alternative would be to use triggers.
This example works:
<Style x:Key="ButtonStyle" TargetType="{x:Type Button}">
<Setter Property="Content" Value="Init Value"/>
<Style.Triggers>
<Trigger Property="IsClicked" Value="True">
<Setter Property="Content" Value="New Value" />
</Trigger>
</Style.Triggers>
</Style>
My problem is that I need a DataTrigger, like this
<Style x:Key="ButtonStyle" TargetType="{x:Type Button}">
<Setter Property="Content" Value="Init Value"/>
<Style.Triggers>
<DataTrigger Binding="{Binding Path=MyUserControlProperty, ElementName=MyUserControl}" Value="True">
<Setter Property="Content" Value="New Value" />
</DataTrigger>
</Style.Triggers>
</Style>
How do I make MyUserControlProperty value change propagate properly?
The funniest thing is if I open the control as a new form the initialisation of Button.Content = "Init Value" does not screw things up and everything just works. What the? Why is this simple task so hard and why so many behaviours?

Answer 1

Don't set Button.Content directly, when you have a binding set on it. If you set Button.Content in the Constructor you effectively remove the binding.
This works:
<Window x:Class="StackOverflow.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="450" Width="800">
<StackPanel>
<Button Content="{Binding Path=ButtonText1, RelativeSource={RelativeSource AncestorType=Window}}" Click="Button1_OnClick"></Button>
</StackPanel>
</Window>
using System.Windows;
namespace StackOverflow
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow
{
public MainWindow()
{
InitializeComponent();
ButtonText1 = "Paul";
}
private void Button1_OnClick(object sender, RoutedEventArgs e)
{
ButtonText1 = "Maria";
}
public string ButtonText1
{
get => (string)GetValue(ButtonText1Property);
set => SetValue(ButtonText1Property, value);
}
// Using a DependencyProperty as the backing store for ButtonText1. This enables animation, styling, binding, etc...
public static readonly DependencyProperty ButtonText1Property =
DependencyProperty.Register("ButtonText1", typeof(string), typeof(MainWindow), new PropertyMetadata("Peter"));
}
}