
Edmund Covington
Top achievements
Rank 1
Edmund Covington
asked on 28 Jan 2014, 03:33 PM
Please can you recommend a way that we can overcome this problem? The lines between siblings on a treeview don't always appear as expected.
Many thanks
Many thanks
4 Answers, 1 is accepted
0
Hello Edmund,
This is a known issue and we plan to fix it for the upcoming Q1 (which is in the middle of February). We also have prepared a workaround which is demonstrated in the attached sample project. In it we are using "Office_Black" theme. We use the RadTreeViewStyle's ExpanderStyle property in order to set the ToggleButton's Width to 21 pixels.
Let us know if this helps you proceed further.
Regards,
Boris Penev
Telerik
This is a known issue and we plan to fix it for the upcoming Q1 (which is in the middle of February). We also have prepared a workaround which is demonstrated in the attached sample project. In it we are using "Office_Black" theme. We use the RadTreeViewStyle's ExpanderStyle property in order to set the ToggleButton's Width to 21 pixels.
<
Style
x:Key
=
"ExpanderStyle"
TargetType
=
"{x:Type ToggleButton}"
>
<
Setter
Property
=
"IsTabStop"
Value
=
"False"
/>
<
Setter
Property
=
"Cursor"
Value
=
"Hand"
/>
<
Setter
Property
=
"BorderBrush"
Value
=
"{StaticResource TreeView_ExpandElement_BorderBrush_ExpandedStates}"
/>
<
Setter
Property
=
"Width"
Value
=
"21"
/>
<
Setter
Property
=
"Template"
>
...
Let us know if this helps you proceed further.
Regards,
Boris Penev
Telerik
TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for WPF.
Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
Sign up for Free application insights >>
Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
Sign up for Free application insights >>
0

Edmund Covington
Top achievements
Rank 1
answered on 29 Jan 2014, 03:43 PM
The example I gave doesn't include a toggle button so how can that fix the issue that we have? I was unable to open the project that you included in Visual Studio 2010.
Regards
Ed
Regards
Ed
0
Accepted
Hello Edmund,
The mentioned ToggleButton is part of the RadTreeView and you can see it on the left side of the RadTreeViewItems which have sub-items (looks like an arrow and rotates when clicked). Here is the whole style which you have to use for this fix
All you need to do is to give this style to the ExpanderStyle property of the RadTreeView:
Regards,
Boris Penev
Telerik
The mentioned ToggleButton is part of the RadTreeView and you can see it on the left side of the RadTreeViewItems which have sub-items (looks like an arrow and rotates when clicked). Here is the whole style which you have to use for this fix
<
ResourceDictionary
>
<
SolidColorBrush
x:Key
=
"TreeView_ExpandElement_BorderBrush_ExpandedStates"
Color
=
"#FF262626"
/>
<
SolidColorBrush
x:Key
=
"ControlElement_Disabled"
Color
=
"#FF8D8D8D"
/>
<
SolidColorBrush
x:Key
=
"TreeView_ExpandElement_Background_Normal"
Color
=
"#FF989898"
/>
<
SolidColorBrush
x:Key
=
"TreeView_ExpandElement_Background_MouseOver"
Color
=
"#FFFDBA64"
/>
<
SolidColorBrush
x:Key
=
"TreeView_ExpandElement_Background_ExpandedStates"
Color
=
"#595959"
/>
<
SolidColorBrush
x:Key
=
"TreeView_ExpandElement_BorderBrush_Normal"
Color
=
"#FF989898"
/>
<
SolidColorBrush
x:Key
=
"TreeView_ExpandElement_BorderBrush_MouseOver"
Color
=
"#FFFDBA64"
/>
<
Style
x:Key
=
"ExpanderStyle"
TargetType
=
"{x:Type ToggleButton}"
>
<
Setter
Property
=
"IsTabStop"
Value
=
"False"
/>
<
Setter
Property
=
"Cursor"
Value
=
"Hand"
/>
<
Setter
Property
=
"BorderBrush"
Value
=
"{StaticResource TreeView_ExpandElement_BorderBrush_ExpandedStates}"
/>
<
Setter
Property
=
"Width"
Value
=
"21"
/>
<
Setter
Property
=
"Template"
>
<
Setter.Value
>
<
ControlTemplate
TargetType
=
"ToggleButton"
>
<
Grid
Background
=
"Transparent"
>
<
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
=
"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
>
<
ObjectAnimationUsingKeyFrames
Storyboard.TargetName
=
"ExpandedVisual"
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"
Background
=
"Transparent"
>
<
Path
x:Name
=
"CollapsedVisual"
Stretch
=
"Fill"
Fill
=
"{StaticResource TreeView_ExpandElement_Background_Normal}"
Data
=
"M0.5,0.5 L5.2,5.4 L5.2,5.4 L0.5,10.5 z"
RenderTransformOrigin
=
"0.5,1"
HorizontalAlignment
=
"Center"
Width
=
"6"
Height
=
"9"
VerticalAlignment
=
"Center"
Stroke
=
"{StaticResource TreeView_ExpandElement_BorderBrush_Normal}"
/>
<
Path
x:Name
=
"CollapsedVisualOver"
Opacity
=
"0"
Stretch
=
"Fill"
Fill
=
"{StaticResource TreeView_ExpandElement_Background_MouseOver}"
Data
=
"M0.5,0.5 L5.2,5.4 L5.2,5.4 L0.5,10.5 z"
RenderTransformOrigin
=
"0.5,1"
HorizontalAlignment
=
"Center"
Width
=
"6"
Height
=
"9"
VerticalAlignment
=
"Center"
Stroke
=
"{StaticResource TreeView_ExpandElement_BorderBrush_MouseOver}"
/>
</
Grid
>
<
Grid
x:Name
=
"ExpandedStates"
Opacity
=
"0"
Background
=
"Transparent"
>
<
Path
x:Name
=
"ExpandedVisual"
HorizontalAlignment
=
"Center"
Margin
=
"2,1,0,0"
Width
=
"7"
Height
=
"7"
VerticalAlignment
=
"Center"
Stretch
=
"Fill"
Fill
=
"{StaticResource TreeView_ExpandElement_Background_ExpandedStates}"
Stroke
=
"{TemplateBinding BorderBrush}"
Data
=
"M3.27,3.75 L6.5,0.5 L6.5,6.5 L0.5,6.5 z"
/>
<
Path
x:Name
=
"ExpandedVisualOver"
HorizontalAlignment
=
"Center"
Margin
=
"2,1,0,0"
Width
=
"7"
Height
=
"7"
VerticalAlignment
=
"Center"
Opacity
=
"0"
Stretch
=
"Fill"
Fill
=
"{StaticResource TreeView_ExpandElement_Background_ExpandedStates}"
Stroke
=
"{TemplateBinding BorderBrush}"
Data
=
"M3.27,3.75 L6.5,0.5 L6.5,6.5 L0.5,6.5 z"
/>
</
Grid
>
</
Grid
>
</
ControlTemplate
>
</
Setter.Value
>
</
Setter
>
</
Style
>
</
ResourceDictionary
>
<telerik:RadTreeView Margin="8" x:Name="tree"
IsDragDropEnabled="True"
SelectionMode="Single"
ExpanderStyle="{StaticResource ExpanderStyle}"
Regards,
Boris Penev
Telerik
TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for WPF.
Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
Sign up for Free application insights >>
Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
Sign up for Free application insights >>
0

Edmund Covington
Top achievements
Rank 1
answered on 30 Jan 2014, 11:14 AM
That worked very well. Thanks very much for your help.