How to make the selected item in the radtreeview to have a style applied (or) to highlight the radtreeview selected item when a radpane is used?

[John]

Code:

<UserControl.Resources>
<ResourceDictionary>
<ControlTemplate x:Key="RadTreeViewItemControlTemplate1" TargetType="{x:Type telerik:RadTreeViewItem}">
<Grid x:Name="RootElement">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition/>
</Grid.RowDefinitions>
<Grid x:Name="HeaderRow" Background="Transparent" MinHeight="{TemplateBinding MinHeight}" SnapsToDevicePixels="True">
<Border x:Name="SelectionUnfocusedVisual" BorderBrush="#FFDBDBDB" BorderThickness="1" Grid.ColumnSpan="6" Grid.Column="2" CornerRadius="1" Visibility="Collapsed">
<Border BorderBrush="Transparent" BorderThickness="1" CornerRadius="0">
<Border.Background>
<LinearGradientBrush EndPoint="0,1">
<GradientStop Color="#FFF8F6F9" Offset="0"/>
<GradientStop Color="#FFF0F0F0" Offset="1"/>
</LinearGradientBrush>
</Border.Background>
</Border>
</Border>
</Grid>
</Grid>
<ControlTemplate.Triggers>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsSelected" Value="True"/>
<Condition Property="IsSelectionActive" Value="False"/>
</MultiTrigger.Conditions>
<Setter Property="Visibility" TargetName="SelectionUnfocusedVisual" Value="Visible"/>
</MultiTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</ResourceDictionary>
</UserControl.Resources>


<DockPanel>
<telerik:RadDocking x:Name="radDocking" Width="245" ConstraintAutoHideArea="False">
<telerik:RadSplitContainer x:Name="radSplitContainer">
<telerik:RadPaneGroup x:Name="radGroup">
<telerik:RadPane x:Name="radPane1" Header="Test" ContextMenuTemplate="{x:Null}" CanUserClose="False" CanFloat="False" Cursor="Hand">
<Grid>
<DockPanel LastChildFill="True">
<telerik:RadTreeView x:Name="radTreeView" DockPanel.Dock="Left" Background="#FF525152" VirtualizingPanel.IsVirtualizing="True">
<telerik:RadTreeView.Resources>
<Style TargetType="{x:Type telerik:RadTreeViewItem}">
<Setter Property="Template" Value="{StaticResource RadTreeViewItemControlTemplate1}" />
</Style>
</telerik:RadTreeView.Resources>
</telerik:RadTreeView>
</DockPanel>
</Grid>
</telerik:RadPane>
</telerik:RadPaneGroup>
</telerik:RadSplitContainer>
</telerik:RadDocking>
</DockPanel>A

After using the Radpane, the selected item is not having the style applied. If RadTreeView alone is used (without having radpane), the selected item in the radtreeview is having the style SelectionUnfocusedVisual which is working properly (i.e), Selected Item gets Highlighted. How to make the selected item in the radtreeview to have a style applied (or) to highlight the radtreeview selected item when a radpane is used?. Thanks.

[Evgenia]

Hi John,

You may find attached a test project where your scenario works as expected. 
Some changes that I did to your scenario for it to work:
1. Added ContentControl to the RadTreeViewItemControlTemplate for the TreeView headers to be visualized.
2. I extended the MinHeight to 20pixels in the RadTreeViewItem style for better visibility of the Border you want to see when Selecting and moving away the Focus from the TreeViewItems
3. A sample TextBox control to grab the Focus from your control, so that you can observe the desired MultiTrigger change.

Could you please clarify that this is what you intended? If not - please give us steps to reproduce the unwanted behavior in the same project.

Regards,
Evgenia
Telerik

 

 

[John]

Hi Evegenia,

            First of all, I Thank You for your reply. 
            I found out the solution. That is we need to update the RadDocking layout once we selected the RadTreeViewItem.

            Solution:

    this.radDocking.UpdateLayout();

             I updated the RadDocking layout by writing the above code in the MouseLeftButtonUp event of RadTreeView control.

Regards,
John