I have custom classes and custom styles for RadDiagram, RadDiagramShape, RadDiagramConnection, RadDiagramConnector. Now I have run into a styling issue that requires pro help from you :)
I want my connectors to show their label when either of these two conditions is met:
1) The connector's shape (or any of its children) is hovered by the mouse.
2) Any connection, from any shape, is being dragged.
I started off adding a TextBlock to my connector style, but it seems I cannot properly toggle its visibility. If I set it to "Collapsed", it is never shown. Maybe this approach is all wrong, but still, here it is:
I want my connectors to show their label when either of these two conditions is met:
1) The connector's shape (or any of its children) is hovered by the mouse.
2) Any connection, from any shape, is being dragged.
I started off adding a TextBlock to my connector style, but it seems I cannot properly toggle its visibility. If I set it to "Collapsed", it is never shown. Maybe this approach is all wrong, but still, here it is:
<
Style
TargetType
=
"chart:MyChartConnector"
x:Key
=
"MyChartConnectorStyle"
BasedOn
=
"{StaticResource RadDiagramConnectorStyle}"
>
<
Setter
Property
=
"FocusVisualStyle"
Value
=
"{x:Null}"
/>
<!-- Auto seems reasonable? -->
<
Setter
Property
=
"Width"
Value
=
"Auto"
/>
<
Setter
Property
=
"Height"
Value
=
"Auto"
/>
<
Setter
Property
=
"Template"
>
<
Setter.Value
>
<
ControlTemplate
TargetType
=
"chart:MyChartConnector"
>
<
Grid
>
<
VisualStateManager.VisualStateGroups
>
<
VisualStateGroup
x:Name
=
"MouseStates"
>
<
VisualState
x:Name
=
"Normal"
/>
<
VisualState
x:Name
=
"MouseOver"
>
<
Storyboard
>
<
ObjectAnimationUsingKeyFrames
Duration
=
"0"
Storyboard.TargetName
=
"DisplayElement"
Storyboard.TargetProperty
=
"Visibility"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
>
<
DiscreteObjectKeyFrame.Value
>
<
Visibility
>Collapsed</
Visibility
>
</
DiscreteObjectKeyFrame.Value
>
</
DiscreteObjectKeyFrame
>
</
ObjectAnimationUsingKeyFrames
>
</
Storyboard
>
</
VisualState
>
</
VisualStateGroup
>
<
VisualStateGroup
x:Name
=
"ActiveStates"
>
<
VisualState
x:Name
=
"Inactive"
/>
<
VisualState
x:Name
=
"Active"
>
<
Storyboard
>
<
ObjectAnimationUsingKeyFrames
Duration
=
"0"
Storyboard.TargetName
=
"DisplayElement"
Storyboard.TargetProperty
=
"Visibility"
>
<
DiscreteObjectKeyFrame
KeyTime
=
"0"
>
<
DiscreteObjectKeyFrame.Value
>
<
Visibility
>Collapsed</
Visibility
>
</
DiscreteObjectKeyFrame.Value
>
</
DiscreteObjectKeyFrame
>
</
ObjectAnimationUsingKeyFrames
>
</
Storyboard
>
</
VisualState
>
</
VisualStateGroup
>
</
VisualStateManager.VisualStateGroups
>
<
Grid
>
<
Ellipse
x:Name
=
"OverElement"
Width
=
"20"
Height
=
"20"
Fill
=
"{TemplateBinding Background}"
StrokeThickness
=
"{TemplateBinding BorderThickness}"
Stroke
=
"{TemplateBinding BorderBrush}"
/>
<
Ellipse
x:Name
=
"DisplayElement"
Width
=
"20"
Height
=
"20"
Fill
=
"#40000000"
StrokeThickness
=
"{TemplateBinding BorderThickness}"
Stroke
=
"{TemplateBinding BorderBrush}"
/>
<!-- This does not work as intented :( -->
<
TextBlock
Text
=
"{TemplateBinding DisplayName}"
Visibility
=
"Collapsed"
>
<
TextBlock.Style
>
<
Style
TargetType
=
"TextBlock"
>
<
Style.Triggers
>
<
DataTrigger
Binding
=
"{Binding RelativeSource={RelativeSource AncestorType={x:Type chart:MyChartShape}}, Path=IsMouseOver}"
Value
=
"True"
>
<
Setter
Property
=
"Visibility"
Value
=
"Visible"
/>
</
DataTrigger
>
</
Style.Triggers
>
</
Style
>
</
TextBlock.Style
>
</
TextBlock
>
</
Grid
>
</
Grid
>
</
ControlTemplate
>
</
Setter.Value
>
</
Setter
>
</
Style
>