Hi!
Here's how you could implement it in Windows Forms -
https://mindfusion.eu/_samples/linkanimation_winforms.zip class LinkAnimator
{
public LinkAnimator(DiagramLink link, DiagramView view)
{
this.link = link;
this.view = view;
}
public void AnimatePath(
int animationLength,
params PointF[] points)
{
if (points.Length < 2)
return;
// total length of specified path
float pathLen = Enumerable.
Range(0, points.Length - 1).
Aggregate(0f, (len, index) =>
Utilities.Distance(points[index], points[index + 1]));
// prepare the link
link.ControlPoints.Clear();
link.ControlPoints.Add(points[0]);
link.ControlPoints.Add(points[0]);
// animate from a thread
var animationThread = new Thread(
() =>
{
for (int s = 0; s < points.Length - 1; s++)
{
// how much to grow the segment for each animation frame
var segment = new Vector(points[s], points[s + 1]);
float segmentTime = animationLength * segment.Length / pathLen;
var increment = segment * FrameLen / segmentTime;
// frames for current segment
for (int f = 0; f < segmentTime / FrameLen; f++)
{
Thread.Sleep(FrameLen);
link.EndPoint = link.EndPoint + increment;
view.Invoke(new Action(
() => link.UpdateFromPoints()));
}
// set exact position in case animation hasn't reached it due to rounding
if (link.EndPoint != points[s + 1])
{
link.EndPoint = points[s + 1];
view.Invoke(new Action(
() => link.UpdateFromPoints()));
}
// add next point
if (s < points.Length - 2)
link.ControlPoints.Add(points[s + 1]);
}
});
animationThread.Start();
}
DiagramLink link;
DiagramView view;
const int FrameLen = 1000 / 30; // in milliseconds
}
diagram.LinkShape = LinkShape.Polyline;
var n1 = diagram.Factory.CreateShapeNode(10, 10, 20, 20);
var n2 = diagram.Factory.CreateShapeNode(210, 10, 20, 20);
var n3 = diagram.Factory.CreateShapeNode(10, 110, 20, 20);
var n4 = diagram.Factory.CreateShapeNode(210, 110, 20, 20);
var l1 = diagram.Factory.CreateDiagramLink(n1, n2);
var l2 = diagram.Factory.CreateDiagramLink(n3, n4);
new LinkAnimator(l1, diagramView).
AnimatePath(2000,
l1.StartPoint,
new PointF(70, 10),
new PointF(130, 30),
l1.EndPoint);
new LinkAnimator(l2, diagramView).
AnimatePath(1000, l2.StartPoint, l2.EndPoint);
Code above assume link shapes with two control points per segment, you'll need to extend it if you want to use with Bezier links. Also if you are with older version of the control, you'll need to call UpdateFromPoints overload that takes updateSegmentCount argument; latest one does not require that.
Regards,
Slavcho
Mindfusion