Creating DependencyPropety in custom Silverlight UserControl

Creating DependencyPropety in custom Silverlight UserControl

Can anyone help me to create ItemsSource property in my custom Silverlight UserControl?

Here is my a quite simple ViewModel:

public class MyVM {     public ObservableCollection<int> Values { set; get; }      public MyVM()     {         this.Values = new ObservableCollection<int>();     } } 

This is my (inner) UserControl which I past into main UserContorl (MainPage):

<UserControl x:Class="SilverlightApplication1.SilverlightControl1" 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" mc:Ignorable="d" d:DesignHeight="300" d:DesignWidth="400">  <Grid x:Name="LayoutRoot" Background="White" >     <Border BorderBrush="Black" BorderThickness="2">         <ListBox Margin="5" Name="lst" />     </Border> </Grid> </UserControl>  public partial class SilverlightControl1 : UserControl {     public IEnumerable MyItemsSource     {         get         {             return (IEnumerable)GetValue(MyItemsSourceProperty);         }         set         {             SetValue(MyItemsSourceProperty, value);         }     }     public static readonly DependencyProperty MyItemsSourceProperty =         DependencyProperty.Register("MyItemsSource", typeof(IEnumerable), typeof(SilverlightControl1), new PropertyMetadata(null));       public SilverlightControl1()     {         InitializeComponent();     } } 

This is a small Container which hosts my UserControl:

<UserControl x:Class="SilverlightApplication1.MainPage" 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"          xmlns:local="clr-namespace:SilverlightApplication1" mc:Ignorable="d" d:DesignHeight="300" d:DesignWidth="400">  <Grid x:Name="LayoutRoot" Background="White">     <local:SilverlightControl1 Name="qqq" MyItemsSource="{Binding Path=Values}"/>  </Grid> </UserControl>  public partial class MainPage : UserControl {     public MainPage()     {         InitializeComponent();         MyVM vm = new MyVM();         vm.Values.Add(1);         vm.Values.Add(2);         vm.Values.Add(3);         vm.Values.Add(4);          this.DataContext = vm;     } } 

How can I bind data to my inner ListBox?

Answers & Comments...

Answer: 1

First, your SilverlightControl1 does not have its own DataContext so that means it is inheriting the DataContext of its container (MainPage in this case). I'll answer assuming you want it setup this way (as opposed to the SilverlightControl1 having its own DC). With this said, the MyItemsSource is useless. You can drop it all together. Remove it from MainPage.xaml and just include the control as so:

<Grid x:Name="LayoutRoot" Background="White">     <local:SilverlightControl1 x:Name="qqq" /> </Grid> 

Secondly, your ListBox is not bound to anything. Since it is inheriting the DC of Main, you can bind to Values as so:

<Grid x:Name="LayoutRoot" Background="White" >     <Border BorderBrush="Black" BorderThickness="2">         <ListBox Margin="5" Name="lst" ItemsSource="{Binding Values}" />     </Border> </Grid> 

by : tsiornhttp://stackoverflow.com/users/223155

Answer: 2

I have stopped using UserControl completely, partly because of this. I use CustomControls instead. The usability and complaxity is exactly the same. You have possibiliity for codebehind and a separate model (although I mostly use the control's code as the model itself setting this.DataContext = this;). My code also gets more structured (at least I think so) and I have more possibilities to change the UI for the control.

The only disadvantage with using CustomControls is that I don't have the design surface like you have in UserControls and Windows. The UI is put in the Generic.xaml file instead (be default) and built by writing XAML in the editor, opposed to using your mouse. That's a bummer to start with, but I got used to it surprisingly fast.

So my answer is that if you use CustomControls, you can do the exact same. The Bindings are written like this:

MyItemsSource="{Binding RelativeSource="{RelativeSource Mode=TemplatedParent}" Path=Values}" 

...or simply:

MyItemsSource="{TemplateBinding Values}" 

...if you don't have to add any Converters or anything else to the Binding.

by : Mats Magnemhttp://stackoverflow.com/users/961818

---