Custom Control Dependency Property Binding

Jason Butera picture Jason Butera · Aug 10, 2012 · Viewed 19.8k times · Source

I am going insane trying to get this to work with even the most basic example. I cannot for the life of me get binding to work. Here is a super easy example that is not working for me. I MUST be doing something incorrect.

My Custom Control in my control library assembly:

public class TestControl : Control
{
    public static readonly DependencyProperty TestPropProperty =
        DependencyProperty.Register("TestProp", typeof(string), typeof(TestControl), new UIPropertyMetadata(null));

    public string TestProp
    {
        get { return (string)GetValue(TestPropProperty); }
        set { SetValue(TestPropProperty, value); }
    }

    static TestControl()
    {
        DefaultStyleKeyProperty.OverrideMetadata(typeof(TestControl), new FrameworkPropertyMetadata(typeof(TestControl)));
    }
}

And its XAML template:

<Style TargetType="{x:Type local:TestControl}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type local:TestControl}">
                <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
                    <StackPanel>
                        <TextBlock Text="Testing..." />
                        <Label Content="{Binding TestProp}" Padding="10" />
                    </StackPanel>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Here's the XAML consuming the control in a wpf window with a reference to my control library:

<Grid>
    <ItemsControl Name="mylist">
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <my:TestControl TestProp="{Binding Path=Name}" />
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
</Grid>

And here's the code behind:

public partial class Test2 : Window
{
    public class TestObject : INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler PropertyChanged;
        protected void OnPropertyChanged(string PropertyName)
        {
            if (PropertyChanged != null)
                PropertyChanged(this, new PropertyChangedEventArgs(PropertyName));
        }

        private int _id;
        public int id
        {
            get { return _id; }
            set { _id = value; OnPropertyChanged("id"); }
        }

        private string _Name;
        public string Name
        {
            get { return _Name; }
            set { _Name = value; OnPropertyChanged("Name"); }
        }
    }

    public Test2()
    {
        InitializeComponent();

        mylist.ItemsSource = new TestObject[]
        {
            new TestObject(){ id = 1, Name = "Tedd" },
            new TestObject(){ id = 2, Name = "Fred" },
            new TestObject(){ id = 3, Name = "Jim" },
            new TestObject(){ id = 4, Name = "Jack" },
        };
    }
}

Running this example gives me four instances of the control, however I only see the "Testing..." TextBlock on each. My label is never bound. What am I misunderstanding and doing incorrectly?

Answer

Clemens picture Clemens · Aug 10, 2012

You haven't set the proper binding source. You would either have to set RelativeSource:

<Label Content="{Binding TestProp, RelativeSource={RelativeSource Mode=TemplatedParent}}" />

Or use TemplateBinding:

<Label Content="{TemplateBinding TestProp}"/>