Need to add a horizontal line between node and annotation

[tealer]

here is my custom node, now the annotation and node has distance

I want to insert a horizontal line between node and annotation,like the red line in the picture below

how can I achieve this effect?

[Deepa Thiruppathy]

Hi Tealer,

Greetings from Syncfusion.

Requirement: How to add horizontal line between Nodes and Node’s Annotation.

We request you share the below details from your side,

1. Do you need that line for indication purpose?
2. Are you going to add any connection points, ports, connectors on that line?

Please explain the purpose adding line between node and its annotation. We will help you depends on that.

Regards,

Deepa Thiruppathy

[tealer]

Thank you for your reply.

I just need that line for indication purpose, this line will not add anything.

[Deepa Thiruppathy]

Hi Tealer,

Requirement: How to add horizontal line between Node and its Annotation.

We have added a horizontal line between Node and its Annotation using TextAnnotationViewModel class properties.

Code snippet:

<!--Initialize the Node-->

<syncfusion:NodeViewModel OffsetX="300" OffsetY="300" UnitHeight="100" UnitWidth="150">

    <!--Initialize the annotations-->

    <syncfusion:NodeViewModel.Annotations>

        <!--Initialize the AnnotationCollection-->

        <syncfusion:AnnotationCollection>

            <!--Initialize the Text editor view model-->

            <syncfusion:TextAnnotationViewModel FontWeight="Bold" Text="EN" Margin="-60,-20,0,0"/>

            <syncfusion:TextAnnotationViewModel FontWeight="Bold" Text="OUT" Margin="60,-20,0,0"/>

            <syncfusion:TextAnnotationViewModel FontWeight="Bold" Text="PT" Margin="-60,20,0,0"/>

            <syncfusion:TextAnnotationViewModel FontWeight="Bold" Text="ET" Margin="60,20,0,0"/>

            <syncfusion:TextAnnotationViewModel FontSize="15" Text="TP timer" Margin="0,-40,0,0"/>

            <syncfusion:TextAnnotationViewModel FontSize="15" Text="Timer" Margin="0,60,0,0"/>

            <syncfusion:TextAnnotationViewModel FontSize="15" Text="SetTime" Margin="-100,20,0,0"/>

            <syncfusion:TextAnnotationViewModel FontSize="15" Text="T#0ms" Margin="115,20,0,0"/>

            <!--Adding horizontal line between node and annotation using TextAnnotationViewModel-->

            <syncfusion:TextAnnotationViewModel FontWeight="Bold" FontSize="35" Text="_" Margin="85,5,0,0" Foreground="Red"/>

        </syncfusion:AnnotationCollection>

    </syncfusion:NodeViewModel.Annotations>

</syncfusion:NodeViewModel>

Sample link: https://www.syncfusion.com/downloads/support/directtrac/general/ze/NodeCreation239898128

Regards,

Deepa Thiruppathy

[tealer]

Thank you for your reply.

The answer solved my problem, but how to make annotation uneditable?

[Deepa Thiruppathy]

Requirement: How to make annotation non-editable?

You can make annotation to non-editable by enabling ReadOnly property of Annotations.

Code snippet:

<!--Initialize the annotation with read only property-->

<syncfusion:TextAnnotationViewModel FontSize="15" Text="T#0ms" Margin="115,20,0,0" ReadOnly="True"/>

Please refer below UG documentation link to know more about Annotation editing,

https://help.syncfusion.com/wpf/diagram/annotation/positioningandappearance?cs-save-lang=1&cs-lang=xaml#how-to-edit-the-annotation

[tealer]

Thank you for your reply, 

[Deepa Thiruppathy]

You are welcome. Please let us know if you require any further assistance.