How to Costume The Draw Line Animation When Manipulating the Connection

[Walliam]

Hey, Guy
     In my app, I need to Costume The Drawing Line Animation In Raddiagram According to the Mouse Behaviors. Is There Any Demo/Project that implements this kind of feature.
     To describe my demand more specifically, I Attach a photo below to explain. Thanks a lot.
                                                                                                                By Willliam

[Walliam]

Upload the Picture Failed, Repost

[Zarko]

Hi William,
As far as I understand you want your connections to have 90 angels, is this right ?
For this I'll advice you to try out our connection routers:

this.diagram.RoutingService.Router = new AStarRouter(this.diagram) { WallOptimization = true };
this.diagram.RoutingService.FreeRouter = new AStarRouter(this.diagram) { WallOptimization = true };

I've attached a sample project demonstrating this so could you please examine it and tell us if this is what you're looking for?

Regards,
Zarko
Telerik

 

 

[Walliam]

Zarko:
THX for your answer, but that is NOT what I mean.
Acutualy, I have already costumed the RoutingService.Router as An AStarRouter. However, I need to costumed the animation when you dragging the connection from a connector to another one. THE ANIMATION could show the dynamic Routing Path.

Regards,
William

[Zarko]

Hi William,
I'm sorry for the misunderstanding - to change this geometry you'll need to create your custom RadDiagramConnection and override its UpdateDeferredGeometry method in which you'll have to create your new geometry:

protected override void UpdateDeferredGeometry(Point start, Point end, Point[] points)
{
    var newGeometry = new RectangleGeometry(new Rect(start, end));
    if (this.deferredPath != null) this.deferredPath.Data = newGeometry;
}

In the new attached project you can examine this approach.

Regards,
Zarko
Telerik

 

 

[Walliam]

Hi Zarko,
Thank you so much for your approaching. I could understand your custom RadDiagramConnection in Demo, But when I try to drag a Connection from a Connector in certain RadDiagramShape to another Connector, this new Connection is Still RadDiagramConnection by default. Is there some Event that need to be modifed?

Regards,
William 

[Zarko]

Hello William,
Yes - when you create a connection from a shape's Connector the RadDiagram will create a RadDiagramConnection by default. To change this you'll have to inherit it and override the GetConnectionContainerForItemOverride method:

protected override Telerik.Windows.Diagrams.Core.IConnection GetConnectionContainerForItemOverride(object item)
{
    return new CustomConnection();
}

Note that when you create a connection from a connector we show it's actual geometry not the deferred one and because of this instead of UpdateDeferredGeometry CreateGeometry method will be called. Also if RouteConnections is true the FreeRouter will be used:

this.diagram.RouteConnections = true;
this.diagram.RoutingService.FreeRouter = new AStarRouter(this.diagram);

I've attached a new project and I hope I was able to help you.

Regards,
Zarko
Telerik