New to Telerik UI for Silverlight? Download free 30-day trial

ItemContainerStyle

The Telerik RadTreeView supports ItemContainerStyle. The container created by the RadTreeView for each item in the collection is of type RadTreeViewItem. The style defined for the ItemContainerStyle property should have the RadTreeViewItem class as TargetType.

The ItemContainerStyle clashes with the theming. You cannot have both an ItemContainerStyle and a non-application theme for the RadTreeView. The reason is that they both set a style. If you want to use a different theme and ItemContainerStyle you need to set the theme as an application theme (which sets a DefaultStyle rather than Style).

Example 1: RadTreeView definition

<UserControl.Resources> 
 
    <sampleData:RadTreeViewSampleData x:Key="DataSource"/> 
 
    <DataTemplate x:Key="Team"> 
        <TextBlock Text="{Binding Name}" /> 
    </DataTemplate> 
 
    <telerik:HierarchicalDataTemplate x:Key="Division" ItemTemplate="{StaticResource Team}" 
       ItemsSource="{Binding Teams}"> 
        <TextBlock Text="{Binding Name}" /> 
    </telerik:HierarchicalDataTemplate> 
 
    <telerik:HierarchicalDataTemplate x:Key="League" ItemTemplate="{StaticResource Division}" 
       ItemsSource="{Binding Divisions}"> 
        <TextBlock Text="{Binding Name}" /> 
    </telerik:HierarchicalDataTemplate> 
 
</UserControl.Resources> 
 
<Grid x:Name="LayoutRoot" Background="White"> 
 
    <telerik:RadTreeView x:Name="radTreeView" 
       ItemsSource="{Binding Source={StaticResource DataSource}, Path=LeaguesDataSource}" 
       ItemTemplate="{StaticResource League}"/> 
 
</Grid> 

The data source class RadTreeViewSampleData assigned to the RadTreeView is covered in greater details in the chapter Binding to Object.

Figure 1: Result from Example 1

RadTreeView populated with sample data

Defining the style in the resources of the control or in the resources of the application makes it reusable.

ItemContainerStyle Definition

Example 2 demonstrates how to create an ItemContainerStyle, which sets the Foreground and IsExpanded properties of the items.

Example 2: ItemContainerStyle Definition

<!-- If you are using the NoXaml binaries, you will have to base the style on the default one for the theme like so:  
<Style x:Key="myItemContainerStyle" TargetType="telerik:RadTreeViewItem" BasedOn="{StaticResource RadTreeViewItemStyle}">--> 
 
<Style x:Key="myItemContainerStyle" TargetType="telerik:RadTreeViewItem"> 
    <Setter Property="Foreground" Value="Red"/> 
    <Setter Property="IsExpanded" Value="True"/> 
</Style> 

Example 3: Setting the ItemContainerStyle property

<telerik:RadTreeView x:Name="radTreeView" 
   ItemsSource="{Binding Source={StaticResource DataSource}, Path=LeaguesDataSource}" 
   ItemTemplate="{StaticResource League}" 
   ItemContainerStyle="{StaticResource myItemContainerStyle}"/> 

Figure 2: Result from Example 3

RadTreeView with custom ItemContainerStyle

When using ItemContainerStyle with static items, it will get applied only to the direct children of the RadTreeView - the top-level items. If you want their child items to have the same style, you have to manually set the ItemContainerStyle property of the RadTreeViewItems.

When using the ItemContainerStyle with dynamic items, its value gets inherited through the hierarchy thanks to the HierarchicalDataTemplate. You are free to break the inheritance, when needed, by using multiple nested HierarchicalDataTemplates and by setting the ItemContainerStyle property of each of them.

If you have different items and/or you prefer to display items with different styles, you should use the ItemContainerStyleSelector property.

See Also

In this article
Not finding the help you need? Improve this article