WPF : How to access observablecollection in a nested usercontrol?

Question

in my application I'm using two usercontrol : UserControl1 is the main one, inside it, I have UserControl2 used six times.

UserControl2 has several combobox, and I would like to fill them dynamically from the final application. As a start I'm trying to bind data to one of them.

The combobox in UserControl2 look like this :

 <ComboBox x:Name="VidTransform" Template="{DynamicResource BaseComboBoxStyle}" ItemContainerStyle="{DynamicResource BaseComboBoxItemStyle}" Grid.Row="1" ItemsSource="{Binding Path=DataContext.VidTransformsNames,ElementName=Ch_Parameters, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" SelectedValue="{Binding Path=SelectedTransform,ElementName=Ch_Parameters, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"/>

At the moment I'm only able to fill it manually, using this ObservableCollection (all strings shows up correctly) :

    private ObservableCollection<string> _VidTransformsNames = new ObservableCollection<string>(new[] { "test0", "test1", "test2", "test3", "test4", "test5" });
    public ObservableCollection<string> VidTransformsNames
    {
        get { return _VidTransformsNames; }
        set { _VidTransformsNames = value; }
    }

In UserControl1 (which contains UserControl2), I tried to create an other ObservableCollection and fill it dynamically at runtime in my final application.

Here it is :

    private ObservableCollection<string> _VideoTransformsNames = new ObservableCollection<string>(new[] { "Test0", "Test1", "Test2", "Test3", "Test4", "Test5" });
    public ObservableCollection<string> VideoTransformsNames
    {
        get { return _VideoTransformsNames; }
        set { _VideoTransformsNames = value; }
    }

And then binding :

<local:UserControl1 VidTransformsNames="{Binding Path=VideoTransformsNames, ElementName=cmix, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>

I'm beginner, but here I'm wrong for sure, as I get this error :

A 'Binding' cannot be set on the 'VidTransformsNames' property of type 'UserControl1'. A 'Binding' can only be set on a DependencyProperty of a DependencyObject.

How can I access and fill up at runtime the observablecollection of UserControl2 if it is nested in UserControl1 ?

madoxdev madoxdev · Accepted Answer · 2016-02-19T06:14:20

This is because your property needs to be declared properly as DependencyProperty

Dependency properties and the WPF property system extend property functionality by providing a type that backs a property, as an alternative implementation to the standard pattern of backing the property with a private field. The name of this type is DependencyProperty. The other important type that defines the WPF property system is DependencyObject. DependencyObject defines the base class that can register and own a dependency property.

Please follow this https://msdn.microsoft.com/library/ms753358(v=vs.100).aspx, or Dependency Property Overview https://msdn.microsoft.com/pl-pl/library/ms752914(v=vs.100).aspx

Example taken from above articles:

public static readonly DependencyProperty IsSpinningProperty = 
    DependencyProperty.Register(
    "IsSpinning", typeof(Boolean),


...


    );
public bool IsSpinning
{
    get { return (bool)GetValue(IsSpinningProperty); }
    set { SetValue(IsSpinningProperty, value); }
}

Let's try to set it to your code:

public static readonly DependencyProperty VideoTransformsNamesProperty = 
DependencyProperty.Register("VideoTransformsNames", typeof(ObservableCollection<string>), typeof(UserControl1));

public string VideoTransformsNames
{
    get
    {
        return this.GetValue(VideoTransformsNamesProperty) as ObservableCollection<string>;
    }
    set
    {
        this.SetValue(VideoTransformsNamesProperty, value);
    }
}

WPF : How to access observablecollection in a nested usercontrol?

1 Answers