RadTreeView's Foreground Color issue only on the first load

4 posts, 0 answers
  1. Rajesh
    Rajesh avatar
    15 posts
    Member since:
    Jan 2013

    Posted 20 Jan 2013 Link to this post

    Hi there,

       My RadTreeview has a foreground color issue. On a selection of a "treeview Item", i  have set background color to be "Blue" and it's text to be "White". On some situation i see the text color to be "Black".

    Here are my observation:-

    1. There are 4 level deep untill you reach the end child node. When I expand each item in the treeview using its default "rectangle" icon, then I DO NOT see any issue of text to be "BLACK".

    2. If i expand the item in the treeview just clicking on the text of it, then I see the foreground text of the treeview item to be "Black". Once it is loaded, when I collapse and expand the treeview item again by clicing on the text of it, It's foreground text seems FINE (i get the "White" text").

    3. One more thing I observed. On the first time load, expanding on clicing on the text of it, I receive "Black" foreground. At this time I tried clicking way away from the treeview control (assume that I had another control next to the treeview control). Now I see the foreground text changed to "White".

    Special Note: - not just that one node that I am showing in the screenshot. I happens to anynode at initial load.

    (Looks like the issue is only on the initial load)

    I have attached the screenshot, treeview code and the Rad Treeview's default template that I use.

    My self and my customer woul really appreciate your response. I tried few things and I ran out of idea.

    <UserControl.Resources>
     
        <ResourceDictionary>
            <Style x:Key="RADTreeViewItemStyle" TargetType="telerik:RadTreeViewItem">
                <Setter Property="HorizontalAlignment" Value="Left"/>
                <Setter Property="HorizontalContentAlignment" Value="Left" />
                <Setter Property="VerticalContentAlignment" Value="Center" />
                <Setter Property="CheckState" Value="Off" />
                <Setter Property="BorderThickness" Value="1" />
                <Setter Property="Padding" Value="1 0 5 0" />
                <Setter Property="IsDropAllowed" Value="True" />
                <Setter Property="ItemsOptionListType" Value="Default" />
                <Setter Property="IsEnabled" Value="True" />
                <Setter Property="MinHeight" Value="24" />               
                <Setter Property="Template" Value="{StaticResource TreeViewItemDefaultTemplate}" />
                <Setter Property="ItemsPanel">
                    <Setter.Value>
                        <ItemsPanelTemplate>
                            <telerik:TreeViewPanel VerticalAlignment="Bottom" />
                        </ItemsPanelTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
             
            <telerik:ContainerBindingCollection x:Name="BindingsCollections">
                <telerik:ContainerBinding PropertyName="IsSelected" Binding="{Binding IsSelected, Mode=TwoWay}"/>
                <telerik:ContainerBinding PropertyName="IsExpanded" Binding="{Binding IsExpanded, Mode=TwoWay}"/>
                <telerik:ContainerBinding PropertyName="IsLoadOnDemandEnabled" Binding="{Binding IsLoadOnDemandEnabled, Mode=TwoWay}"/>
            </telerik:ContainerBindingCollection>
     
            <telerik:HierarchicalDataTemplate x:Key="AvailableFieldTemplate">
                <TextBlock Text="{Binding Name}"/>
            </telerik:HierarchicalDataTemplate>
     
            <telerik:HierarchicalDataTemplate x:Key="FunctionTemplate"
                                          telerik:ContainerBinding.ContainerBindings="{StaticResource BindingsCollections}"
                                          ItemTemplate="{StaticResource AvailableFieldTemplate}"
                                          ItemsSource="{Binding AvailableFields}" >
     
                <TextBlock Text="{Binding Name}"/>
            </telerik:HierarchicalDataTemplate>
     
            <telerik:HierarchicalDataTemplate x:Key="FeatureTemplate"
                                          telerik:ContainerBinding.ContainerBindings="{StaticResource BindingsCollections}"
                                          ItemTemplate="{StaticResource FunctionTemplate}"
                                          ItemsSource="{Binding Functions}" >
     
                <TextBlock Text="{Binding Name}"/>
            </telerik:HierarchicalDataTemplate>
     
            <telerik:HierarchicalDataTemplate x:Key="ApplicationTemplate"
                                          telerik:ContainerBinding.ContainerBindings="{StaticResource BindingsCollections}"
                                          ItemTemplate="{StaticResource FeatureTemplate}"
                                          ItemsSource="{Binding Features}">
     
                <TextBlock Text="{Binding Name}"/>
            </telerik:HierarchicalDataTemplate>
     
        </ResourceDictionary>
    </UserControl.Resources>
     
    <Grid x:Name="LayoutRoot" >
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>
     
            <!--<StackPanel>-->           
                <telerik:RadTreeView x:Name="LocationsView_RadTreeView" VerticalAlignment="Top" ItemContainerStyle="{StaticResource RADTreeViewItemStyle}"
                                     ItemsSource="{Binding RelativeSource={RelativeSource AncestorType=uc:BaseMainView}, Path=DataContext.FieldEditorViewModel.SelectedProductCatalog, Mode=TwoWay}"
                                     ItemTemplate="{StaticResource ApplicationTemplate}" SelectionMode="Single"
                                     IsLoadOnDemandEnabled="True" LoadOnDemand="LocationsView_RadTreeView_LoadOnDemand"
                                     IsExpandOnSingleClickEnabled="True" SelectedItem="{Binding Path=SelectedItem, Mode=TwoWay}" ScrollViewer.VerticalScrollBarVisibility="Auto">
                </telerik:RadTreeView>           
            <!--</StackPanel>-->
        </Grid>
    </Grid>
    <!-- Default Template values for Telerik RadTreeview-->
    <SolidColorBrush x:Key="TreeView_ExpandElement_BorderBrush_ExpandedStates" Color="#FF262626" />
    <SolidColorBrush x:Key="TreeView_ExpandElement_Background_Normal" Color="#FF989898" />
    <SolidColorBrush x:Key="TreeView_ExpandElement_BorderBrush_Normal" Color="#FF989898" />
    <SolidColorBrush x:Key="TreeView_ExpandElement_Background_MouseOver" Color="#FFFDBA64" />
    <SolidColorBrush x:Key="TreeView_ExpandElement_BorderBrush_MouseOver" Color="#FFFDBA64" />
    <SolidColorBrush x:Key="TreeView_ExpandElement_Background_ExpandedStates" Color="#595959" />
    <SolidColorBrush x:Key="ControlElement_Disabled" Color="#FF8D8D8D" />
    <telerik:Office_BlackTheme x:Key="Theme" />
    <SolidColorBrush x:Key="DragBetweenItemsFeedback_BackgroundBrush" Color="#FFFA8C3B" />
    <Style x:Key="RadTreeViewStyle" TargetType="telerik:RadTreeView">
        <Setter Property="telerik:AnimationManager.AnimationSelector">
            <Setter.Value>
                <telerik:AnimationSelector>
                    <Telerik_Windows_Controls_Animation:TreeViewExpandCollapseAnimation AnimationName="Expand" Direction="In" />
                    <Telerik_Windows_Controls_Animation:TreeViewExpandCollapseAnimation AnimationName="Collapse" Direction="Out" />
                </telerik:AnimationSelector>
            </Setter.Value>
        </Setter>
        <Setter Property="IsDragTooltipEnabled" Value="True" />
        <Setter Property="Background" Value="Transparent" />
        <Setter Property="IsEnabled" Value="True" />
        <Setter Property="IsDropPreviewLineEnabled" Value="True" />
        <Setter Property="IsRootLinesEnabled" Value="True" />
        <Setter Property="IsExpandOnDblClickEnabled" Value="True" />
        <Setter Property="IsDragPreviewEnabled" Value="True" />
        <Setter Property="SelectionMode" Value="Single" />
        <Setter Property="ItemsIndent" Value="20" />
        <Setter Property="ItemsPanel">
            <Setter.Value>
                <ItemsPanelTemplate>
                    <telerik:TreeViewPanel />
                </ItemsPanelTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="telerik:RadDragAndDropManager.AllowDrop" Value="True" />
        <Setter Property="ItemEditTemplate">
            <Setter.Value>
                <DataTemplate>
                    <TextBox />
                </DataTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="ExpanderStyle">
                <Setter.Value>
                    <Style TargetType="ToggleButton">
                        <Setter Property="IsEnabled" Value="True" />
                        <Setter Property="BorderBrush" Value="{StaticResource TreeView_ExpandElement_BorderBrush_ExpandedStates}" />
                        <Setter Property="IsTabStop" Value="False" />
                        <Setter Property="Cursor" Value="Hand" />
                        <Setter Property="Template">
                            <Setter.Value>
                                <ControlTemplate TargetType="ToggleButton">
                                    <Grid Margin="5,0,0,0">
                                        <VisualStateManager.VisualStateGroups>
                                            <VisualStateGroup x:Name="CommonStates">
                                                <VisualState x:Name="Normal" />
                                                <VisualState x:Name="MouseOver">
                                                    <Storyboard>
                                                        <DoubleAnimation Duration="0:0:0.05"
                                                                         Storyboard.TargetName="ExpandedVisualOver"
                                                                         Storyboard.TargetProperty="Opacity"
                                                                         To="1" />
                                                        <DoubleAnimation Duration="0:0:0.05"
                                                                         Storyboard.TargetName="CollapsedVisualOver"
                                                                         Storyboard.TargetProperty="Opacity"
                                                                         To="1" />
                                                    </Storyboard>
                                                </VisualState>
                                                <VisualState x:Name="Disabled">
                                                    <Storyboard>
                                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ExpandedVisual" Storyboard.TargetProperty="Fill">
                                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ControlElement_Disabled}" />
                                                        </ObjectAnimationUsingKeyFrames>
                                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ExpandedVisual" Storyboard.TargetProperty="Stroke">
                                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ControlElement_Disabled}" />
                                                        </ObjectAnimationUsingKeyFrames>
                                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="CollapsedVisual" Storyboard.TargetProperty="Fill">
                                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ControlElement_Disabled}" />
                                                        </ObjectAnimationUsingKeyFrames>
                                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="CollapsedVisual" Storyboard.TargetProperty="Stroke">
                                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ControlElement_Disabled}" />
                                                        </ObjectAnimationUsingKeyFrames>
                                                    </Storyboard>
                                                </VisualState>
                                            </VisualStateGroup>
                                            <VisualStateGroup x:Name="CheckStates">
                                                <VisualState x:Name="Checked">
                                                    <Storyboard>
                                                        <DoubleAnimation Duration="0:0:0.05"
                                                                         Storyboard.TargetName="ExpandedStates"
                                                                         Storyboard.TargetProperty="Opacity"
                                                                         To="1" />
                                                        <DoubleAnimation Duration="0:0:0.05"
                                                                         Storyboard.TargetName="CollapsedStates"
                                                                         Storyboard.TargetProperty="Opacity"
                                                                         To="0" />
                                                    </Storyboard>
                                                </VisualState>
                                                <VisualState x:Name="Unchecked">
                                                    <Storyboard>
                                                        <DoubleAnimation Duration="0:0:0.05"
                                                                         Storyboard.TargetName="ExpandedStates"
                                                                         Storyboard.TargetProperty="Opacity"
                                                                         To="0" />
                                                        <DoubleAnimation Duration="0:0:0.05"
                                                                         Storyboard.TargetName="CollapsedStates"
                                                                         Storyboard.TargetProperty="Opacity"
                                                                         To="1" />
                                                    </Storyboard>
                                                </VisualState>
                                            </VisualStateGroup>
                                        </VisualStateManager.VisualStateGroups>
                                        <Grid x:Name="CollapsedStates">
                                            <Path x:Name="CollapsedVisual"
                                                  Width="6"
                                                  Height="9"
                                                  Margin="3,1,0,0"
                                                  HorizontalAlignment="Left"
                                                  VerticalAlignment="Center"
                                                  Data="M0.5,0.5 L5.2,5.4 L5.2,5.4 L0.5,10.5 z"
                                                  Fill="{StaticResource TreeView_ExpandElement_Background_Normal}"
                                                  RenderTransformOrigin="0.5,1"
                                                  Stretch="Fill"
                                                  Stroke="{StaticResource TreeView_ExpandElement_BorderBrush_Normal}" />
                                            <Path x:Name="CollapsedVisualOver"
                                                  Width="6"
                                                  Height="9"
                                                  Margin="3,1,0,0"
                                                  HorizontalAlignment="Left"
                                                  VerticalAlignment="Center"
                                                  Data="M0.5,0.5 L5.2,5.4 L5.2,5.4 L0.5,10.5 z"
                                                  Fill="{StaticResource TreeView_ExpandElement_Background_MouseOver}"
                                                  Opacity="0"
                                                  RenderTransformOrigin="0.5,1"
                                                  Stretch="Fill"
                                                  Stroke="{StaticResource TreeView_ExpandElement_BorderBrush_MouseOver}" />
                                        </Grid>
                                        <Grid x:Name="ExpandedStates" Opacity="0">
                                            <Path x:Name="ExpandedVisual"
                                                  Width="7"
                                                  Height="7"
                                                  Margin="2,1,0,0"
                                                  HorizontalAlignment="Left"
                                                  VerticalAlignment="Center"
                                                  Data="M3.27,3.75 L6.5,0.5 L6.5,6.5 L0.5,6.5 z"
                                                  Fill="{StaticResource TreeView_ExpandElement_Background_ExpandedStates}"
                                                  Stretch="Fill"
                                                  Stroke="{TemplateBinding BorderBrush}" />
                                            <Path x:Name="ExpandedVisualOver"
                                                  Width="7"
                                                  Height="7"
                                                  Margin="2,1,0,0"
                                                  HorizontalAlignment="Left"
                                                  VerticalAlignment="Center"
                                                  Data="M3.27,3.75 L6.5,0.5 L6.5,6.5 L0.5,6.5 z"
                                                  Fill="{StaticResource TreeView_ExpandElement_Background_ExpandedStates}"
                                                  Opacity="0"
                                                  Stretch="Fill"
                                                  Stroke="{TemplateBinding BorderBrush}" />
                                        </Grid>
                                    </Grid>
                                </ControlTemplate>
                            </Setter.Value>
                        </Setter>
                    </Style>
                </Setter.Value>
            </Setter>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="telerik:RadTreeView">
                    <Grid x:Name="RootElement">
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="DropStates">
                                <VisualState x:Name="DropImpossible" />
                                <VisualState x:Name="DropPossible" />
                                <VisualState x:Name="DropRootPossible">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ScrollViewer" Storyboard.TargetProperty="Background">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <SolidColorBrush Color="#7fFCD590" />
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <Border Background="{TemplateBinding Background}"
                                    BorderBrush="{TemplateBinding BorderBrush}"
                                    BorderThickness="{TemplateBinding BorderThickness}">
                            <Grid>
                                <ScrollViewer x:Name="ScrollViewer"
                                                  Background="{x:Null}"
                                                  BorderThickness="0"
                                                  IsTabStop="False"
                                                  Padding="{TemplateBinding Padding}"
                                                  telerik:ScrollViewerExtensions.EnableMouseWheel="True"
                                                  telerik:StyleManager.Theme="{StaticResource Theme}">
                                    <ItemsPresenter />
                                </ScrollViewer>
                                <Grid x:Name="DragBetweenItemsFeedback"
                                          Height="8"
                                          Margin="{TemplateBinding Padding}"
                                          HorizontalAlignment="Left"
                                          VerticalAlignment="Top"
                                          IsHitTestVisible="False"
                                          Visibility="Collapsed">
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="8" />
                                        <ColumnDefinition />
                                    </Grid.ColumnDefinitions>
                                    <Ellipse Width="8"
                                                 Height="8"
                                                 HorizontalAlignment="Left"
                                                 VerticalAlignment="Center"
                                                 Stroke="{StaticResource DragBetweenItemsFeedback_BackgroundBrush}"
                                                 StrokeThickness="2" />
                                    <Rectangle Grid.Column="1"
                                                   Height="2"
                                                   Margin="-2,3,0,0"
                                                   VerticalAlignment="Top"
                                                   Fill="{StaticResource DragBetweenItemsFeedback_BackgroundBrush}"
                                                   RadiusX="2"
                                                   RadiusY="2" />
                                </Grid>
                            </Grid>
                        </Border>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <SolidColorBrush x:Key="ControlSubItem_OuterBorder_MouseOver" Color="#FFFFC92B" />
    <Thickness x:Key="ControlSubItem_OuterBorderThickness">1</Thickness>
    <SolidColorBrush x:Key="ControlSubItem_InnerBorder_MouseOver" Color="#FFFFFFFF" />
    <Thickness x:Key="ControlSubItem_InnerBorderThickness">1</Thickness>
    <LinearGradientBrush x:Key="ControlSubItem_Background_MouseOver" StartPoint="0.5,0" EndPoint="0.5,1">
        <GradientStop Offset="1" Color="#FFFFFBA3" />
        <GradientStop Offset="0" Color="#FFFFFBDA" />
    </LinearGradientBrush>
    <CornerRadius x:Key="ControlSubItem_InnerCornerRadius">0</CornerRadius>
    <CornerRadius x:Key="ControlSubItem_OuterCornerRadius">1</CornerRadius>
    <SolidColorBrush x:Key="ControlSubItem_OuterBorder_UnFocus" Color="#FFdbdbdb" />
    <SolidColorBrush x:Key="ControlSubItem_InnerBorder_UnFocus" Color="Transparent" />
    <LinearGradientBrush x:Key="ControlSubItem_Background_UnFocus" EndPoint="0,1">
        <GradientStop Offset="1" Color="#003C66" /><!-- Top -->
        <GradientStop Offset="0" Color="#0065A1" /><!-- Bottom -->
    </LinearGradientBrush>
    <SolidColorBrush x:Key="ControlSubItem_OuterBorder_Selected" Color="#FFFFC92B" />
    <SolidColorBrush x:Key="ControlSubItem_InnerBorder_Selected" Color="#FFFFFFFF" />
    <LinearGradientBrush x:Key="ControlSubItem_Background_Selected" StartPoint="0.5,0" EndPoint="0.5,1">
        <GradientStop Offset="1" Color="#003C66" /> <!--Top -->
        <GradientStop Color="#0065A1"/> <!-- Bottom -->
    </LinearGradientBrush>
    <SolidColorBrush x:Key="TreeView_LineColor" Color="#FFCCCCCC" />
    <SolidColorBrush x:Key="FocusBrushBlack" Color="#FF000000" />
    <ControlTemplate x:Key="TreeViewItemDefaultTemplate" TargetType="telerik:RadTreeViewItem">
        <Grid x:Name="RootElement">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition />
            </Grid.RowDefinitions>
            <VisualStateManager.VisualStateGroups>
                <VisualStateGroup x:Name="EditStates">
                    <VisualState x:Name="Display" />
                    <VisualState x:Name="Edit">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Duration="0"
                                                               Storyboard.TargetName="EditHeaderElement"
                                                               Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                            </ObjectAnimationUsingKeyFrames>
                            <ObjectAnimationUsingKeyFrames Duration="0"
                                                               Storyboard.TargetName="Header"
                                                               Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed" />
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
                <VisualStateGroup x:Name="CommonStates">
                    <VisualState x:Name="Normal" />
                    <VisualState x:Name="Disabled">
                        <Storyboard>
                            <DoubleAnimation Duration="0:0:0.0"
                                                 Storyboard.TargetName="Header"
                                                 Storyboard.TargetProperty="Opacity"
                                                 To="0.35" />
                            <DoubleAnimation Duration="0:0:0.0"
                                                 Storyboard.TargetName="Image"
                                                 Storyboard.TargetProperty="Opacity"
                                                 To="0.35" />
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="MouseOver">
                        <Storyboard>
                            <DoubleAnimation Duration="0:0:0.1"
                                                 Storyboard.TargetName="MouseOverVisual"
                                                 Storyboard.TargetProperty="Opacity"
                                                 To="1" />
                            <ObjectAnimationUsingKeyFrames Duration="0:0:0.1"
                                                               Storyboard.TargetName="Header"
                                                               Storyboard.TargetProperty="Foreground">                               
                                <DiscreteObjectKeyFrame KeyTime="0" Value="Black" />
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
                <VisualStateGroup x:Name="SelectionStates">
                    <VisualState x:Name="Unselected" />
                    <VisualState x:Name="Selected">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Duration="0"
                                                               Storyboard.TargetName="SelectionVisual"
                                                               Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                            </ObjectAnimationUsingKeyFrames>
                            <ObjectAnimationUsingKeyFrames Duration="0:0:0.1" Storyboard.TargetName="Header" Storyboard.TargetProperty="Foreground">                               
                                <DiscreteObjectKeyFrame KeyTime="0" Value="White" />
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="SelectedUnfocused">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Duration="0"
                                                               Storyboard.TargetName="SelectionUnfocusedVisual"
                                                               Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                            </ObjectAnimationUsingKeyFrames>
                            <ObjectAnimationUsingKeyFrames Duration="0:0:0.1" Storyboard.TargetName="Header" Storyboard.TargetProperty="Foreground">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="White" />
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
                <VisualStateGroup x:Name="LoadingOnDemandStates">
                    <VisualState x:Name="LoadingOnDemand">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Duration="0"
                                                               Storyboard.TargetName="LoadingVisual"
                                                               Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                            </ObjectAnimationUsingKeyFrames>
                            <ObjectAnimationUsingKeyFrames Duration="0"
                                                               Storyboard.TargetName="Expander"
                                                               Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed" />
                            </ObjectAnimationUsingKeyFrames>
                            <DoubleAnimation Duration="0:0:1"
                                                 From="0"
                                                 RepeatBehavior="Forever"
                                                 Storyboard.TargetName="LoadingVisualAngleTransform"
                                                 Storyboard.TargetProperty="Angle"
                                                 To="359" />
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="LoadingOnDemandReverse" />
                </VisualStateGroup>
                <VisualStateGroup x:Name="FocusStates">
                    <VisualState x:Name="Focused">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Duration="0"
                                                               Storyboard.TargetName="FocusVisual"
                                                               Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Unfocused" />
                </VisualStateGroup>
                <VisualStateGroup x:Name="ExpandStates">
                    <VisualState x:Name="Expanded" />
                    <VisualState x:Name="Collapsed" />
                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>
            <Grid x:Name="HeaderRow"
                      MinHeight="{TemplateBinding MinHeight}"
                      Background="Transparent">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>
                <Border Grid.Column="2"
                            Grid.ColumnSpan="6"
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            CornerRadius="2" />
                <Border x:Name="MouseOverVisual"
                            Grid.Column="2"
                            Grid.ColumnSpan="6"
                            BorderBrush="{StaticResource ControlSubItem_OuterBorder_MouseOver}"
                            BorderThickness="{StaticResource ControlSubItem_OuterBorderThickness}"
                            CornerRadius="{StaticResource ControlSubItem_OuterCornerRadius}"
                            Opacity="0">
                    <Border Background="{StaticResource ControlSubItem_Background_MouseOver}"
                                BorderBrush="{StaticResource ControlSubItem_InnerBorder_MouseOver}"
                                BorderThickness="{StaticResource ControlSubItem_InnerBorderThickness}"
                                CornerRadius="{StaticResource ControlSubItem_InnerCornerRadius}" />
                </Border>
                <Border x:Name="SelectionUnfocusedVisual"
                            Grid.Column="2"
                            Grid.ColumnSpan="6"
                            BorderBrush="{StaticResource ControlSubItem_OuterBorder_UnFocus}"
                            BorderThickness="{StaticResource ControlSubItem_OuterBorderThickness}"
                            CornerRadius="{StaticResource ControlSubItem_OuterCornerRadius}"
                            Visibility="Collapsed">
                    <Border Background="{StaticResource ControlSubItem_Background_UnFocus}"
                                BorderBrush="{StaticResource ControlSubItem_InnerBorder_UnFocus}"
                                BorderThickness="{StaticResource ControlSubItem_InnerBorderThickness}"
                                CornerRadius="{StaticResource ControlSubItem_InnerCornerRadius}" />
                </Border>
                <Border x:Name="SelectionVisual"
                            Grid.Column="2"
                            Grid.ColumnSpan="6"
                            BorderBrush="{StaticResource ControlSubItem_OuterBorder_Selected}"
                            BorderThickness="{StaticResource ControlSubItem_OuterBorderThickness}"
                            CornerRadius="{StaticResource ControlSubItem_OuterCornerRadius}"
                            Visibility="Collapsed">
                    <Border Background="{StaticResource ControlSubItem_Background_Selected}"
                                BorderBrush="{StaticResource ControlSubItem_InnerBorder_Selected}"
                                BorderThickness="{StaticResource ControlSubItem_InnerBorderThickness}"
                                CornerRadius="{StaticResource ControlSubItem_InnerCornerRadius}" />
                </Border>
                <StackPanel x:Name="IndentContainer" Orientation="Horizontal">
                    <Rectangle x:Name="IndentFirstVerticalLine"
                                   Width="1"
                                   VerticalAlignment="Top"
                                   Stroke="{StaticResource TreeView_LineColor}"
                                   Visibility="Collapsed">
                        <Rectangle.Clip>
                            <RectangleGeometry Rect="0,0,1,10000" />
                        </Rectangle.Clip>
                    </Rectangle>
                </StackPanel>
                <Grid x:Name="ListRootContainer"
                          Grid.Column="1"
                          MinWidth="20"
                          HorizontalAlignment="Center">
                    <Rectangle x:Name="HorizontalLine"
                                   Height="1"
                                   HorizontalAlignment="Right"
                                   VerticalAlignment="Center"
                                   Stroke="{StaticResource TreeView_LineColor}">
                        <Rectangle.Clip>
                            <RectangleGeometry Rect="0,0,10000,1" />
                        </Rectangle.Clip>
                    </Rectangle>
                    <Rectangle x:Name="VerticalLine"
                                   Width="1"
                                   HorizontalAlignment="Center"
                                   VerticalAlignment="Top"
                                   Stroke="{StaticResource TreeView_LineColor}">
                        <Rectangle.Clip>
                            <RectangleGeometry Rect="0,0,1,10000" />
                        </Rectangle.Clip>
                    </Rectangle>
                    <ToggleButton x:Name="Expander"
                                      Background="{TemplateBinding Background}"
                                      IsTabStop="False" />
                    <Grid x:Name="LoadingVisual"
                              HorizontalAlignment="Center"
                              VerticalAlignment="Center"
                              RenderTransformOrigin="0.5,0.5"
                              Visibility="Collapsed">
                        <Grid.RenderTransform>
                            <TransformGroup>
                                <RotateTransform x:Name="LoadingVisualAngleTransform" Angle="0" CenterX="0.5" CenterY="0.5" />
                            </TransformGroup>
                        </Grid.RenderTransform>
                        <Path Width="10"
                                  Height="10"
                                  Data="M1,0 A1,1,90,1,1,0,-1"
                                  Stretch="Fill"
                                  Stroke="{TemplateBinding Foreground}"
                                  StrokeStartLineCap="Round"
                                  StrokeThickness="1" />
                        <Path Width="4"
                                  Height="4"
                                  Margin="5,-1.5,0,0"
                                  HorizontalAlignment="Left"
                                  VerticalAlignment="Top"
                                  Data="M0,-1.1 L0.1,-1 L0,-0.9"
                                  Fill="{TemplateBinding Foreground}"
                                  Stretch="Fill"
                                  StrokeThickness="1" />
                    </Grid>
                </Grid>
                <CheckBox x:Name="CheckBoxElement"
                              Grid.Column="2"
                              Margin="5,0,0,0"
                              VerticalAlignment="Center"
                              IsTabStop="False"
                              telerik:StyleManager.Theme="{StaticResource Theme}"
                              Visibility="Collapsed" />
                <RadioButton x:Name="RadioButtonElement"
                                 Grid.Column="2"
                                 Margin="5,0,0,0"
                                 VerticalAlignment="Center"
                                 IsTabStop="False"
                                 telerik:StyleManager.Theme="{StaticResource Theme}"
                                 Visibility="Collapsed" />
                <Image x:Name="Image"
                           Grid.Column="3"
                           MaxWidth="16"
                           MaxHeight="16"
                           Margin="2"
                           HorizontalAlignment="Center"
                           VerticalAlignment="Center" />
                <Rectangle x:Name="FocusVisual"
                               Grid.Column="2"
                               Grid.ColumnSpan="6"
                               IsHitTestVisible="False"
                               RadiusX="3"
                               RadiusY="3"
                               Stroke="{StaticResource FocusBrushBlack}"
                               StrokeDashArray="1 2"
                               StrokeThickness="1"
                               Visibility="Collapsed" />
                <Grid Grid.Column="4" Grid.ColumnSpan="2">
                    <ContentControl x:Name="Header"
                                          Margin="{TemplateBinding Padding}"
                                          HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                          VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                          Content="{TemplateBinding Header}"
                                          Foreground="{TemplateBinding Foreground}"
                                          ContentTemplate="{TemplateBinding HeaderTemplate}" />
                    <ContentPresenter x:Name="EditHeaderElement"
                                          Margin="{TemplateBinding Padding}"
                                          HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                          VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                          Visibility="Collapsed" />
                </Grid>
            </Grid>
            <ItemsPresenter x:Name="ItemsHost"
                                Grid.Row="1"
                                Visibility="Collapsed" />
        </Grid>
    </ControlTemplate>

    Please help and thanks in advance.

  2. Tina Stancheva
    Admin
    Tina Stancheva avatar
    3298 posts

    Posted 21 Jan 2013 Link to this post

    Hello Rajesh,

    Can you send us the custom ControlTemplate of the RadTreeViewItems (the TreeViewItemDefaultTemplate you use in the RadTreeViewItem Style)? If you define the Foreground property changes in it, it would help us to get a better understanding of the logic you applied to change to foreground of the selected items.

    Thank you in advance.

    Regards,
    Tina Stancheva
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

  3. DevCraft banner
  4. Rajesh
    Rajesh avatar
    15 posts
    Member since:
    Jan 2013

    Posted 22 Jan 2013 Link to this post

    Hi Tina,

      Thanks for looking at my issue.

    Here is my RadTreeview Default template that I use. (Pasted in "Format Code" block)

    We would really appreciate your response.
    <!-- Default Template values for Telerik RadTreeview-->
    <SolidColorBrush x:Key="TreeView_ExpandElement_BorderBrush_ExpandedStates" Color="#FF262626" />
    <SolidColorBrush x:Key="TreeView_ExpandElement_Background_Normal" Color="#FF989898" />
    <SolidColorBrush x:Key="TreeView_ExpandElement_BorderBrush_Normal" Color="#FF989898" />
    <SolidColorBrush x:Key="TreeView_ExpandElement_Background_MouseOver" Color="#FFFDBA64" />
    <SolidColorBrush x:Key="TreeView_ExpandElement_BorderBrush_MouseOver" Color="#FFFDBA64" />
    <SolidColorBrush x:Key="TreeView_ExpandElement_Background_ExpandedStates" Color="#595959" />
    <SolidColorBrush x:Key="ControlElement_Disabled" Color="#FF8D8D8D" />
    <telerik:Office_BlackTheme x:Key="Theme" />
    <SolidColorBrush x:Key="DragBetweenItemsFeedback_BackgroundBrush" Color="#FFFA8C3B" />
    <Style x:Key="RadTreeViewStyle" TargetType="telerik:RadTreeView">
        <Setter Property="telerik:AnimationManager.AnimationSelector">
            <Setter.Value>
                <telerik:AnimationSelector>
                    <Telerik_Windows_Controls_Animation:TreeViewExpandCollapseAnimation AnimationName="Expand" Direction="In" />
                    <Telerik_Windows_Controls_Animation:TreeViewExpandCollapseAnimation AnimationName="Collapse" Direction="Out" />
                </telerik:AnimationSelector>
            </Setter.Value>
        </Setter>
        <Setter Property="IsDragTooltipEnabled" Value="True" />
        <Setter Property="Background" Value="Transparent" />
        <Setter Property="IsEnabled" Value="True" />
        <Setter Property="IsDropPreviewLineEnabled" Value="True" />
        <Setter Property="IsRootLinesEnabled" Value="True" />
        <Setter Property="IsExpandOnDblClickEnabled" Value="True" />
        <Setter Property="IsDragPreviewEnabled" Value="True" />
        <Setter Property="SelectionMode" Value="Single" />
        <Setter Property="ItemsIndent" Value="20" />
        <Setter Property="ItemsPanel">
            <Setter.Value>
                <ItemsPanelTemplate>
                    <telerik:TreeViewPanel />
                </ItemsPanelTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="telerik:RadDragAndDropManager.AllowDrop" Value="True" />
        <Setter Property="ItemEditTemplate">
            <Setter.Value>
                <DataTemplate>
                    <TextBox />
                </DataTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="ExpanderStyle">
                <Setter.Value>
                    <Style TargetType="ToggleButton">
                        <Setter Property="IsEnabled" Value="True" />
                        <Setter Property="BorderBrush" Value="{StaticResource TreeView_ExpandElement_BorderBrush_ExpandedStates}" />
                        <Setter Property="IsTabStop" Value="False" />
                        <Setter Property="Cursor" Value="Hand" />
                        <Setter Property="Template">
                            <Setter.Value>
                                <ControlTemplate TargetType="ToggleButton">
                                    <Grid Margin="5,0,0,0">
                                        <VisualStateManager.VisualStateGroups>
                                            <VisualStateGroup x:Name="CommonStates">
                                                <VisualState x:Name="Normal" />
                                                <VisualState x:Name="MouseOver">
                                                    <Storyboard>
                                                        <DoubleAnimation Duration="0:0:0.05"
                                                                         Storyboard.TargetName="ExpandedVisualOver"
                                                                         Storyboard.TargetProperty="Opacity"
                                                                         To="1" />
                                                        <DoubleAnimation Duration="0:0:0.05"
                                                                         Storyboard.TargetName="CollapsedVisualOver"
                                                                         Storyboard.TargetProperty="Opacity"
                                                                         To="1" />
                                                    </Storyboard>
                                                </VisualState>
                                                <VisualState x:Name="Disabled">
                                                    <Storyboard>
                                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ExpandedVisual" Storyboard.TargetProperty="Fill">
                                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ControlElement_Disabled}" />
                                                        </ObjectAnimationUsingKeyFrames>
                                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ExpandedVisual" Storyboard.TargetProperty="Stroke">
                                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ControlElement_Disabled}" />
                                                        </ObjectAnimationUsingKeyFrames>
                                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="CollapsedVisual" Storyboard.TargetProperty="Fill">
                                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ControlElement_Disabled}" />
                                                        </ObjectAnimationUsingKeyFrames>
                                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="CollapsedVisual" Storyboard.TargetProperty="Stroke">
                                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ControlElement_Disabled}" />
                                                        </ObjectAnimationUsingKeyFrames>
                                                    </Storyboard>
                                                </VisualState>
                                            </VisualStateGroup>
                                            <VisualStateGroup x:Name="CheckStates">
                                                <VisualState x:Name="Checked">
                                                    <Storyboard>
                                                        <DoubleAnimation Duration="0:0:0.05"
                                                                         Storyboard.TargetName="ExpandedStates"
                                                                         Storyboard.TargetProperty="Opacity"
                                                                         To="1" />
                                                        <DoubleAnimation Duration="0:0:0.05"
                                                                         Storyboard.TargetName="CollapsedStates"
                                                                         Storyboard.TargetProperty="Opacity"
                                                                         To="0" />
                                                    </Storyboard>
                                                </VisualState>
                                                <VisualState x:Name="Unchecked">
                                                    <Storyboard>
                                                        <DoubleAnimation Duration="0:0:0.05"
                                                                         Storyboard.TargetName="ExpandedStates"
                                                                         Storyboard.TargetProperty="Opacity"
                                                                         To="0" />
                                                        <DoubleAnimation Duration="0:0:0.05"
                                                                         Storyboard.TargetName="CollapsedStates"
                                                                         Storyboard.TargetProperty="Opacity"
                                                                         To="1" />
                                                    </Storyboard>
                                                </VisualState>
                                            </VisualStateGroup>
                                        </VisualStateManager.VisualStateGroups>
                                        <Grid x:Name="CollapsedStates">
                                            <Path x:Name="CollapsedVisual"
                                                  Width="6"
                                                  Height="9"
                                                  Margin="3,1,0,0"
                                                  HorizontalAlignment="Left"
                                                  VerticalAlignment="Center"
                                                  Data="M0.5,0.5 L5.2,5.4 L5.2,5.4 L0.5,10.5 z"
                                                  Fill="{StaticResource TreeView_ExpandElement_Background_Normal}"
                                                  RenderTransformOrigin="0.5,1"
                                                  Stretch="Fill"
                                                  Stroke="{StaticResource TreeView_ExpandElement_BorderBrush_Normal}" />
                                            <Path x:Name="CollapsedVisualOver"
                                                  Width="6"
                                                  Height="9"
                                                  Margin="3,1,0,0"
                                                  HorizontalAlignment="Left"
                                                  VerticalAlignment="Center"
                                                  Data="M0.5,0.5 L5.2,5.4 L5.2,5.4 L0.5,10.5 z"
                                                  Fill="{StaticResource TreeView_ExpandElement_Background_MouseOver}"
                                                  Opacity="0"
                                                  RenderTransformOrigin="0.5,1"
                                                  Stretch="Fill"
                                                  Stroke="{StaticResource TreeView_ExpandElement_BorderBrush_MouseOver}" />
                                        </Grid>
                                        <Grid x:Name="ExpandedStates" Opacity="0">
                                            <Path x:Name="ExpandedVisual"
                                                  Width="7"
                                                  Height="7"
                                                  Margin="2,1,0,0"
                                                  HorizontalAlignment="Left"
                                                  VerticalAlignment="Center"
                                                  Data="M3.27,3.75 L6.5,0.5 L6.5,6.5 L0.5,6.5 z"
                                                  Fill="{StaticResource TreeView_ExpandElement_Background_ExpandedStates}"
                                                  Stretch="Fill"
                                                  Stroke="{TemplateBinding BorderBrush}" />
                                            <Path x:Name="ExpandedVisualOver"
                                                  Width="7"
                                                  Height="7"
                                                  Margin="2,1,0,0"
                                                  HorizontalAlignment="Left"
                                                  VerticalAlignment="Center"
                                                  Data="M3.27,3.75 L6.5,0.5 L6.5,6.5 L0.5,6.5 z"
                                                  Fill="{StaticResource TreeView_ExpandElement_Background_ExpandedStates}"
                                                  Opacity="0"
                                                  Stretch="Fill"
                                                  Stroke="{TemplateBinding BorderBrush}" />
                                        </Grid>
                                    </Grid>
                                </ControlTemplate>
                            </Setter.Value>
                        </Setter>
                    </Style>
                </Setter.Value>
            </Setter>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="telerik:RadTreeView">
                    <Grid x:Name="RootElement">
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="DropStates">
                                <VisualState x:Name="DropImpossible" />
                                <VisualState x:Name="DropPossible" />
                                <VisualState x:Name="DropRootPossible">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ScrollViewer" Storyboard.TargetProperty="Background">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <SolidColorBrush Color="#7fFCD590" />
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <Border Background="{TemplateBinding Background}"
                                    BorderBrush="{TemplateBinding BorderBrush}"
                                    BorderThickness="{TemplateBinding BorderThickness}">
                            <Grid>
                                <ScrollViewer x:Name="ScrollViewer"
                                                  Background="{x:Null}"
                                                  BorderThickness="0"
                                                  IsTabStop="False"
                                                  Padding="{TemplateBinding Padding}"
                                                  telerik:ScrollViewerExtensions.EnableMouseWheel="True"
                                                  telerik:StyleManager.Theme="{StaticResource Theme}">
                                    <ItemsPresenter />
                                </ScrollViewer>
                                <Grid x:Name="DragBetweenItemsFeedback"
                                          Height="8"
                                          Margin="{TemplateBinding Padding}"
                                          HorizontalAlignment="Left"
                                          VerticalAlignment="Top"
                                          IsHitTestVisible="False"
                                          Visibility="Collapsed">
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="8" />
                                        <ColumnDefinition />
                                    </Grid.ColumnDefinitions>
                                    <Ellipse Width="8"
                                                 Height="8"
                                                 HorizontalAlignment="Left"
                                                 VerticalAlignment="Center"
                                                 Stroke="{StaticResource DragBetweenItemsFeedback_BackgroundBrush}"
                                                 StrokeThickness="2" />
                                    <Rectangle Grid.Column="1"
                                                   Height="2"
                                                   Margin="-2,3,0,0"
                                                   VerticalAlignment="Top"
                                                   Fill="{StaticResource DragBetweenItemsFeedback_BackgroundBrush}"
                                                   RadiusX="2"
                                                   RadiusY="2" />
                                </Grid>
                            </Grid>
                        </Border>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <SolidColorBrush x:Key="ControlSubItem_OuterBorder_MouseOver" Color="#FFFFC92B" />
    <Thickness x:Key="ControlSubItem_OuterBorderThickness">1</Thickness>
    <SolidColorBrush x:Key="ControlSubItem_InnerBorder_MouseOver" Color="#FFFFFFFF" />
    <Thickness x:Key="ControlSubItem_InnerBorderThickness">1</Thickness>
    <LinearGradientBrush x:Key="ControlSubItem_Background_MouseOver" StartPoint="0.5,0" EndPoint="0.5,1">
        <GradientStop Offset="1" Color="#FFFFFBA3" />
        <GradientStop Offset="0" Color="#FFFFFBDA" />
    </LinearGradientBrush>
    <CornerRadius x:Key="ControlSubItem_InnerCornerRadius">0</CornerRadius>
    <CornerRadius x:Key="ControlSubItem_OuterCornerRadius">1</CornerRadius>
    <SolidColorBrush x:Key="ControlSubItem_OuterBorder_UnFocus" Color="#FFdbdbdb" />
    <SolidColorBrush x:Key="ControlSubItem_InnerBorder_UnFocus" Color="Transparent" />
    <LinearGradientBrush x:Key="ControlSubItem_Background_UnFocus" EndPoint="0,1">
        <GradientStop Offset="1" Color="#003C66" /><!-- Top -->
        <GradientStop Offset="0" Color="#0065A1" /><!-- Bottom -->
    </LinearGradientBrush>
    <SolidColorBrush x:Key="ControlSubItem_OuterBorder_Selected" Color="#FFFFC92B" />
    <SolidColorBrush x:Key="ControlSubItem_InnerBorder_Selected" Color="#FFFFFFFF" />
    <LinearGradientBrush x:Key="ControlSubItem_Background_Selected" StartPoint="0.5,0" EndPoint="0.5,1">
        <GradientStop Offset="1" Color="#003C66" /> <!--Top -->
        <GradientStop Color="#0065A1"/> <!-- Bottom -->
    </LinearGradientBrush>
    <SolidColorBrush x:Key="TreeView_LineColor" Color="#FFCCCCCC" />
    <SolidColorBrush x:Key="FocusBrushBlack" Color="#FF000000" />
    <ControlTemplate x:Key="TreeViewItemDefaultTemplate" TargetType="telerik:RadTreeViewItem">
        <Grid x:Name="RootElement">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition />
            </Grid.RowDefinitions>
            <VisualStateManager.VisualStateGroups>
                <VisualStateGroup x:Name="EditStates">
                    <VisualState x:Name="Display" />
                    <VisualState x:Name="Edit">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Duration="0"
                                                               Storyboard.TargetName="EditHeaderElement"
                                                               Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                            </ObjectAnimationUsingKeyFrames>
                            <ObjectAnimationUsingKeyFrames Duration="0"
                                                               Storyboard.TargetName="Header"
                                                               Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed" />
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
                <VisualStateGroup x:Name="CommonStates">
                    <VisualState x:Name="Normal" />
                    <VisualState x:Name="Disabled">
                        <Storyboard>
                            <DoubleAnimation Duration="0:0:0.0"
                                                 Storyboard.TargetName="Header"
                                                 Storyboard.TargetProperty="Opacity"
                                                 To="0.35" />
                            <DoubleAnimation Duration="0:0:0.0"
                                                 Storyboard.TargetName="Image"
                                                 Storyboard.TargetProperty="Opacity"
                                                 To="0.35" />
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="MouseOver">
                        <Storyboard>
                            <DoubleAnimation Duration="0:0:0.1"
                                                 Storyboard.TargetName="MouseOverVisual"
                                                 Storyboard.TargetProperty="Opacity"
                                                 To="1" />
                            <ObjectAnimationUsingKeyFrames Duration="0:0:0.1"
                                                               Storyboard.TargetName="Header"
                                                               Storyboard.TargetProperty="Foreground">                               
                                <DiscreteObjectKeyFrame KeyTime="0" Value="Black" />
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
                <VisualStateGroup x:Name="SelectionStates">
                    <VisualState x:Name="Unselected" />
                    <VisualState x:Name="Selected">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Duration="0"
                                                               Storyboard.TargetName="SelectionVisual"
                                                               Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                            </ObjectAnimationUsingKeyFrames>
                            <ObjectAnimationUsingKeyFrames Duration="0:0:0.1" Storyboard.TargetName="Header" Storyboard.TargetProperty="Foreground">                               
                                <DiscreteObjectKeyFrame KeyTime="0" Value="White" />
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="SelectedUnfocused">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Duration="0"
                                                               Storyboard.TargetName="SelectionUnfocusedVisual"
                                                               Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                            </ObjectAnimationUsingKeyFrames>
                            <ObjectAnimationUsingKeyFrames Duration="0:0:0.1" Storyboard.TargetName="Header" Storyboard.TargetProperty="Foreground">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="White" />
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
                <VisualStateGroup x:Name="LoadingOnDemandStates">
                    <VisualState x:Name="LoadingOnDemand">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Duration="0"
                                                               Storyboard.TargetName="LoadingVisual"
                                                               Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                            </ObjectAnimationUsingKeyFrames>
                            <ObjectAnimationUsingKeyFrames Duration="0"
                                                               Storyboard.TargetName="Expander"
                                                               Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed" />
                            </ObjectAnimationUsingKeyFrames>
                            <DoubleAnimation Duration="0:0:1"
                                                 From="0"
                                                 RepeatBehavior="Forever"
                                                 Storyboard.TargetName="LoadingVisualAngleTransform"
                                                 Storyboard.TargetProperty="Angle"
                                                 To="359" />
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="LoadingOnDemandReverse" />
                </VisualStateGroup>
                <VisualStateGroup x:Name="FocusStates">
                    <VisualState x:Name="Focused">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Duration="0"
                                                               Storyboard.TargetName="FocusVisual"
                                                               Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Unfocused" />
                </VisualStateGroup>
                <VisualStateGroup x:Name="ExpandStates">
                    <VisualState x:Name="Expanded" />
                    <VisualState x:Name="Collapsed" />
                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>
            <Grid x:Name="HeaderRow"
                      MinHeight="{TemplateBinding MinHeight}"
                      Background="Transparent">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>
                <Border Grid.Column="2"
                            Grid.ColumnSpan="6"
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            CornerRadius="2" />
                <Border x:Name="MouseOverVisual"
                            Grid.Column="2"
                            Grid.ColumnSpan="6"
                            BorderBrush="{StaticResource ControlSubItem_OuterBorder_MouseOver}"
                            BorderThickness="{StaticResource ControlSubItem_OuterBorderThickness}"
                            CornerRadius="{StaticResource ControlSubItem_OuterCornerRadius}"
                            Opacity="0">
                    <Border Background="{StaticResource ControlSubItem_Background_MouseOver}"
                                BorderBrush="{StaticResource ControlSubItem_InnerBorder_MouseOver}"
                                BorderThickness="{StaticResource ControlSubItem_InnerBorderThickness}"
                                CornerRadius="{StaticResource ControlSubItem_InnerCornerRadius}" />
                </Border>
                <Border x:Name="SelectionUnfocusedVisual"
                            Grid.Column="2"
                            Grid.ColumnSpan="6"
                            BorderBrush="{StaticResource ControlSubItem_OuterBorder_UnFocus}"
                            BorderThickness="{StaticResource ControlSubItem_OuterBorderThickness}"
                            CornerRadius="{StaticResource ControlSubItem_OuterCornerRadius}"
                            Visibility="Collapsed">
                    <Border Background="{StaticResource ControlSubItem_Background_UnFocus}"
                                BorderBrush="{StaticResource ControlSubItem_InnerBorder_UnFocus}"
                                BorderThickness="{StaticResource ControlSubItem_InnerBorderThickness}"
                                CornerRadius="{StaticResource ControlSubItem_InnerCornerRadius}" />
                </Border>
                <Border x:Name="SelectionVisual"
                            Grid.Column="2"
                            Grid.ColumnSpan="6"
                            BorderBrush="{StaticResource ControlSubItem_OuterBorder_Selected}"
                            BorderThickness="{StaticResource ControlSubItem_OuterBorderThickness}"
                            CornerRadius="{StaticResource ControlSubItem_OuterCornerRadius}"
                            Visibility="Collapsed">
                    <Border Background="{StaticResource ControlSubItem_Background_Selected}"
                                BorderBrush="{StaticResource ControlSubItem_InnerBorder_Selected}"
                                BorderThickness="{StaticResource ControlSubItem_InnerBorderThickness}"
                                CornerRadius="{StaticResource ControlSubItem_InnerCornerRadius}" />
                </Border>
                <StackPanel x:Name="IndentContainer" Orientation="Horizontal">
                    <Rectangle x:Name="IndentFirstVerticalLine"
                                   Width="1"
                                   VerticalAlignment="Top"
                                   Stroke="{StaticResource TreeView_LineColor}"
                                   Visibility="Collapsed">
                        <Rectangle.Clip>
                            <RectangleGeometry Rect="0,0,1,10000" />
                        </Rectangle.Clip>
                    </Rectangle>
                </StackPanel>
                <Grid x:Name="ListRootContainer"
                          Grid.Column="1"
                          MinWidth="20"
                          HorizontalAlignment="Center">
                    <Rectangle x:Name="HorizontalLine"
                                   Height="1"
                                   HorizontalAlignment="Right"
                                   VerticalAlignment="Center"
                                   Stroke="{StaticResource TreeView_LineColor}">
                        <Rectangle.Clip>
                            <RectangleGeometry Rect="0,0,10000,1" />
                        </Rectangle.Clip>
                    </Rectangle>
                    <Rectangle x:Name="VerticalLine"
                                   Width="1"
                                   HorizontalAlignment="Center"
                                   VerticalAlignment="Top"
                                   Stroke="{StaticResource TreeView_LineColor}">
                        <Rectangle.Clip>
                            <RectangleGeometry Rect="0,0,1,10000" />
                        </Rectangle.Clip>
                    </Rectangle>
                    <ToggleButton x:Name="Expander"
                                      Background="{TemplateBinding Background}"
                                      IsTabStop="False" />
                    <Grid x:Name="LoadingVisual"
                              HorizontalAlignment="Center"
                              VerticalAlignment="Center"
                              RenderTransformOrigin="0.5,0.5"
                              Visibility="Collapsed">
                        <Grid.RenderTransform>
                            <TransformGroup>
                                <RotateTransform x:Name="LoadingVisualAngleTransform" Angle="0" CenterX="0.5" CenterY="0.5" />
                            </TransformGroup>
                        </Grid.RenderTransform>
                        <Path Width="10"
                                  Height="10"
                                  Data="M1,0 A1,1,90,1,1,0,-1"
                                  Stretch="Fill"
                                  Stroke="{TemplateBinding Foreground}"
                                  StrokeStartLineCap="Round"
                                  StrokeThickness="1" />
                        <Path Width="4"
                                  Height="4"
                                  Margin="5,-1.5,0,0"
                                  HorizontalAlignment="Left"
                                  VerticalAlignment="Top"
                                  Data="M0,-1.1 L0.1,-1 L0,-0.9"
                                  Fill="{TemplateBinding Foreground}"
                                  Stretch="Fill"
                                  StrokeThickness="1" />
                    </Grid>
                </Grid>
                <CheckBox x:Name="CheckBoxElement"
                              Grid.Column="2"
                              Margin="5,0,0,0"
                              VerticalAlignment="Center"
                              IsTabStop="False"
                              telerik:StyleManager.Theme="{StaticResource Theme}"
                              Visibility="Collapsed" />
                <RadioButton x:Name="RadioButtonElement"
                                 Grid.Column="2"
                                 Margin="5,0,0,0"
                                 VerticalAlignment="Center"
                                 IsTabStop="False"
                                 telerik:StyleManager.Theme="{StaticResource Theme}"
                                 Visibility="Collapsed" />
                <Image x:Name="Image"
                           Grid.Column="3"
                           MaxWidth="16"
                           MaxHeight="16"
                           Margin="2"
                           HorizontalAlignment="Center"
                           VerticalAlignment="Center" />
                <Rectangle x:Name="FocusVisual"
                               Grid.Column="2"
                               Grid.ColumnSpan="6"
                               IsHitTestVisible="False"
                               RadiusX="3"
                               RadiusY="3"
                               Stroke="{StaticResource FocusBrushBlack}"
                               StrokeDashArray="1 2"
                               StrokeThickness="1"
                               Visibility="Collapsed" />
                <Grid Grid.Column="4" Grid.ColumnSpan="2">
                    <ContentControl x:Name="Header"
                                          Margin="{TemplateBinding Padding}"
                                          HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                          VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                          Content="{TemplateBinding Header}"
                                          Foreground="{TemplateBinding Foreground}"
                                          ContentTemplate="{TemplateBinding HeaderTemplate}" />
                    <ContentPresenter x:Name="EditHeaderElement"
                                          Margin="{TemplateBinding Padding}"
                                          HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                          VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                          Visibility="Collapsed" />
                </Grid>
            </Grid>
            <ItemsPresenter x:Name="ItemsHost"
                                Grid.Row="1"
                                Visibility="Collapsed" />
        </Grid>
    </ControlTemplate>


  5. Tina Stancheva
    Admin
    Tina Stancheva avatar
    3298 posts

    Posted 24 Jan 2013 Link to this post

    Hello Rajesh,

    Thank you for getting back to us and sending your custom ControlTemplates. The issue you observe is caused by the visual states of the RadTreeViewItem. As you change the foreground of the items in the Selected states, when you expand an item, the control state is changed from selected to expanded and the White foreground is lost even though the item is still selected.

    This is why I'd suggest a slightly different approach in your case. Instead of changing the Foreground of the items in the ControlTemplate, it would be easier to do this in the DataTemplates. You can bind the Foreground property of the TextBlocks to the Selected business property and use a ValueConverter to set the foreground color based on the selection of the item.

    I prepared a sample solution demonstrating this approach - I changed the TreeViewItemDefaultTemplate by removing the Foreground changing logic from the visual states and I created a sample converter to change the Foreground in the DataTemplates of the RadTreeViewItems.

    Also, please keep in mind that with Silverlight 5 you can use Style bindings to bind the UIElements' properties. This means that in a Silverlight 5 application, you don't have to use the Telerik ContainerBindingCollection. Instead you can apply style setters for the properties:
    <Style x:Key="RADTreeViewItemStyle" TargetType="telerik:RadTreeViewItem">
        <Setter Property="IsSelected" Value="{Binding Selected, Mode=TwoWay}" />
        <Setter Property="IsExpanded" Value="{Binding Expanded, Mode=TwoWay}" />
        <Setter Property="HorizontalAlignment" Value="Left" />
        <Setter Property="HorizontalContentAlignment" Value="Left" />
        ...
    </Style>

    Let me know if that helps and if you have more questions.

    Regards,
    Tina Stancheva
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

Back to Top