Using a ContainerBindingCollection in a Telerik RadTreeView in Silverlight

A RadTreeView is a Telerik control that allows you to display and select from a hierarchal list. Telerik pays close attention to allowing the user to bind their controls to a ViewModel and having it function correctly. The following demonstrates how you can bind an IsSelected property in your view model to a selection in your RadTreeView using the ContainerBindingCollection

I've been frustrated with the Microsoft listbox in the toolkit and its ability to bind selections.  Telerik is a step ahead of the game.  They have come out with a RadTreeView that allows you to do binding to selections without bugs.

You can create HierarchalTemplates for your RadTreeView that bind to selections through a dependency property called ContainerBindings.  The ContainerBindings is of type ContainerBindingCollection as shown below.  You can put your binding for your ViewModel inside this collection.

 

        <telerikControls:ContainerBindingCollection x:Name="SelectedItemBinding">

            <telerikControls:ContainerBinding PropertyName="IsSelected" Binding="{Binding IsSelected, Mode=TwoWay}" />

        </telerikControls:ContainerBindingCollection>

Now your HierarchalDataTemplate looks like this:

<telerikControls:HierarchicalDataTemplate x:Key="MyItemsTemplate"

                                                 telerikControls:ContainerBinding.ContainerBindings="{StaticResource SelectedItemBinding}">

 

            <Border Opacity="{Binding Opacity}" >

                <Grid>

    

                    <TextBlock Margin="10,0,5,0"  Text="{Binding  Name}" />

                </Grid>

            </Border>

        </telerikControls:HierarchicalDataTemplate>

And your RadTreeView looks like this, referring to the items template described above:

        <telerikNavigation:RadTreeView x:Name="myTreeView"   Grid.Row="1" dragDrop:RadDragAndDropManager.AllowDrag="True"

         Background="Black"

         ItemTemplate="{StaticResource MyItemsTemplate}"

         ItemsSource="{Binding MyItemsInTheViewModel}"

         SelectionMode="Extended"

         ScrollViewer.HorizontalScrollBarVisibility="Hidden"  

         ScrollViewer.VerticalScrollBarVisibility="Hidden"

         ItemContainerStyle="{StaticResource MyRadTreeViewItemStyle}"

   />

Inside your ViewModel for your item (the data context of the item in your view, and not the data context for your treeview collection), you would have the property:

    private bool isSelected;
    public bool IsSelected
    {
      get { return isSelected; }
      set
      {
        isSelected = value;
        RaisPropertyChanged(this, "IsSelected");
      }
    }