Question

I am creating a custom “PageHeaderControl” UserControl, with a header property:

 public partial class PageHeaderControl: UserControl
 {
    public static readonly DependencyProperty HeaderProperty =
        DependencyProperty.Register("Header",
                        typeof(string), typeof(PageHeaderControl),
                        new PropertyMetadata(""));

    public string Header
    {
        get { return GetValue(HeaderProperty) as string; }
        set { SetValue(HeaderProperty, value); }
    }

 }

In the XAML for that control, I have:

<sdk:Label Content="{Binding Header,Mode=TwoWay}" />

Now for the problem: When I create the control, binding it only works to do this:

<my:PageHeaderControl Header="This is my page header" />

And it does not work to do this, where PageHeader is the property in my ViewModel holding the header value:

<my:PageHeaderControl Header="{Binding PageHeader,Mode=TwoWay}" />

I thought maybe my properties were messed up, but this also works:

<TextBlock Text="{Binding PageHeader,Mode=TwoWay}" />

Any ideas as to what the problem could be!

Thanks so much!!!

Edit:

In my ViewModel, PageHeader is this:

private string _pageHeader = "This is my page header";
public string PageHeader
{
    get
    {
        return _pageHeader;
    }
    set
    {
        _pageHeader = value;
        RaisePropertyChanged("PageHeader");
    }
}

Edit 2:

When I put a breakpoint inside the “get” for my PageHeader property, it does not get hit AT ALL, unless I add in the TextBlock…

Answer 1

If I understand you correctly you’re trying to bind a property of an element within your control’s XAML markup to the property of the control itself.

If this is the case, see if the following helps you.

PageHeaderControl.xaml:

<UserControl x:Class="TryElementBinding.PageHeaderControl"
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"
x:Name = "MyControl"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="400">

<Grid x:Name="LayoutRoot" Background="White">
    <TextBlock Text="{Binding Header, ElementName=MyControl}"></TextBlock>
</Grid>

PageHeaderControl.xaml.cs:

public partial class PageHeaderControl : UserControl
{
    public static readonly DependencyProperty HeaderProperty =
            DependencyProperty.Register("Header", typeof(string), typeof(PageHeaderControl), new PropertyMetadata(""));

    public string Header
    {
        get
        {
            return GetValue(HeaderProperty) as string;
        }
        set
        {
            SetValue(HeaderProperty, value);
        }
    }

    public PageHeaderControl()
    {
        InitializeComponent();
    }
}

ViewModel.cs:

public class ViewModel : INotifyPropertyChanged
{
    private string _pageHeader = "This is my page header";

    public string PageHeader
    {
        get
        {
            return _pageHeader;
        }
        set
        {
            _pageHeader = value;
            PropertyChanged(this, new PropertyChangedEventArgs("PageHeader"));
        }
    }


    public event PropertyChangedEventHandler PropertyChanged;
}

MainPage.xaml:

<Grid x:Name="LayoutRoot" Background="White">
    <my:PageHeaderControl Header="{Binding PageHeader, Mode=TwoWay}"></my:PageHeaderControl>
</Grid>

MainPage.xaml.cs:

public partial class MainPage : UserControl
{
    public MainPage()
    {
        InitializeComponent();
        DataContext = new ViewModel();
    }
}