How to Costume The Draw Line Animation When Manipulating the Connection

7 posts, 0 answers
  1. William
    William avatar
    7 posts
    Member since:
    Aug 2014

    Posted 18 Jan 2015 Link to this post

    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
  2. William
    William avatar
    7 posts
    Member since:
    Aug 2014

    Posted 18 Jan 2015 Link to this post

    Upload the Picture Failed, Repost
  3. UI for WPF is Visual Studio 2017 Ready
  4. Zarko
    Admin
    Zarko avatar
    755 posts

    Posted 21 Jan 2015 Link to this post

    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
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  5. William
    William avatar
    7 posts
    Member since:
    Aug 2014

    Posted 22 Jan 2015 in reply to Zarko Link to this post

    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

  6. Zarko
    Admin
    Zarko avatar
    755 posts

    Posted 23 Jan 2015 Link to this post

    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
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  7. William
    William avatar
    7 posts
    Member since:
    Aug 2014

    Posted 25 Jan 2015 in reply to Zarko Link to this post

    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 
  8. Zarko
    Admin
    Zarko avatar
    755 posts

    Posted 28 Jan 2015 Link to this post

    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
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
Back to Top
UI for WPF is Visual Studio 2017 Ready