We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Control Template for 'syncfusion:Node'

Thread ID:





128490 Jan 25,2017 02:36 PM UTC Jan 27,2017 08:32 AM UTC WPF 3
Tags: Diagram
Asked On January 25, 2017 02:36 PM UTC


I have a unique requirement to render ports from data template dynamically, so I was trying to create a custom controltemplate for node as following..

It is rendering properly. However, throwing an exception "System.ArgumentNullException" when I move mouse over the node. 

It appears that the exception was coming from 'DragProvider' component, but does not give any details. 

Can you please help me understand what to done in order to create a 'controltemplate' for node ?

I have attached my sample project below.

<Style TargetType="{x:Type syncfusion:Node}">
                    <Setter Property="Template">
                            <ControlTemplate TargetType="{x:Type syncfusion:Node}">
                                <Canvas x:Name="Part_Canvas">
                                    <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}"
                            CornerRadius="2"   Effect="{TemplateBinding CustomEffect}" Height="{TemplateBinding Height}" IsHitTestVisible="True" Width="{TemplateBinding Width}">
                                            <DropShadowBitmapEffect x:Name="ShadowEffect" Color="Gray" Direction="355" ShadowDepth="3" Softness="0.5" Opacity="0.3"/>
                                        <Grid IsHitTestVisible="True">
                                            <syncfusion:DragProvider x:Name="PART_DragProvider" IsHitTestVisible="True" Opacity="1" />
                                            <ContentPresenter ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" ContentSource="Content" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" Visibility="Visible" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                                            <Border x:Name="PART_ConectorOver" IsHitTestVisible="False" Style="{Binding HitPathStyle}" Visibility="Collapsed"/>
                                            <syncfusion:Gripper IsHitTestVisible="True" Style="{Binding GripperStyle, Mode=TwoWay, RelativeSource={RelativeSource FindAncestor, AncestorLevel=1, AncestorType={x:Type syncfusion:Node}}}" Visibility="{Binding GripperVisibility, Mode=TwoWay, RelativeSource={RelativeSource FindAncestor, AncestorLevel=1, AncestorType={x:Type syncfusion:Node}}}"/>

Attachment: DiagramTest_23f46d05.zip

Keerthivasan Ramamoorthy [Syncfusion]
Replied On January 26, 2017 06:43 AM UTC

Hi Srikanth,  
Requirement:” Need to override the Template of the Node and ConnectionPort”.  
We have created simple sample to achieve your requirement. Please refer the sample link as below.  
Sample link: CustomNode
Sample Details:  
In our sample, we have override the ControlTemplate of the Node(Default Template) and override the ControlTemplate of the ConnectionPort to display Border and Grid elements inside the ConnectionPort with Label. 
For details about Node Customization movement, please refer online documentation link as below. 
Please let us know if you require further assistance on this. 
Keerthivasan R. 

Replied On January 26, 2017 07:35 AM UTC

Thanks a lot Keerthi. 

Appreciate your prompt response.

Keerthivasan Ramamoorthy [Syncfusion]
Replied On January 27, 2017 08:32 AM UTC

Hi Srikanth,  
Thanks for your update. Please let us know, if you need any further assistance.  
Keerthivasan R. 


This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

or the page will be automatically redirected to sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon