Chart Animations: UIKit Dynamics Animations

TKChart can uses the UIKit Dynamics physics engine integrated in iOS 7.0 to animate the points in series. It allows you to create interfaces that feel real by adding behaviors such as gravity, attachments (springs) and forces. You define the physical traits that you would like your interface elements to adopt, and the dynamics engine takes care of the rest.

You should set the allowAnimations property to YES to enable UIKit Dynamics animations.

Configuration

The approach below shows how you can apply a fall down animation to the visual points in line series.

_animator = [[UIDynamicAnimator alloc] initWithReferenceView:_chart.plotView];

NSArray *points = [_chart visualPointsForSeries:_chart.series[0]];
TKChartVisualPoint *point = points[4];

for (int i = 0; i<_originalValues.count; i++) {
    TKChartVisualPoint *p = points[i];
    [p.animator removeAllBehaviors];
    p.animator = nil;
    p.center = [_originalValues[i] CGPointValue];
}

point.center = CGPointMake(_location.x, 0);

UICollisionBehavior *collision = [[UICollisionBehavior alloc] initWithItems:points];
collision.translatesReferenceBoundsIntoBoundary = YES;

UIGravityBehavior *gravity = [[UIGravityBehavior alloc] initWithItems:points];
gravity.gravityDirection = CGVectorMake(0.f, 2.f);

UIDynamicItemBehavior *dynamic = [[UIDynamicItemBehavior alloc] initWithItems:points];
dynamic.elasticity = 0.5f;

[_animator addBehavior:dynamic];
[_animator addBehavior:gravity];
[_animator addBehavior:collision];
animator = UIDynamicAnimator(referenceView: chart.plotView)
if let points = chart.visualPoints(for: chart.series[0]) {

    var i = 0
    for point in points {
        if let animator = point.animator {
            animator.removeAllBehaviors()
        }
        point.animator = nil
        if i < originalValues.count {
            point.center = originalValues[i]
        }
        i+=1
    }

    let collision = UICollisionBehavior(items: points)
    collision.translatesReferenceBoundsIntoBoundary = true

    let gravity = UIGravityBehavior(items: points)
    gravity.gravityDirection = CGVector(dx: 0, dy: 2)

    let dynamic = UIDynamicItemBehavior(items: points)
    dynamic.elasticity = 0.5

    animator!.addBehavior(dynamic)
    animator!.addBehavior(gravity)
    animator!.addBehavior(collision)
animator = new UIDynamicAnimator (chart.PlotView);
TKChartVisualPoint[] points = chart.VisualPointsForSeries (chart.Series [0]);
TKChartVisualPoint point = points [4];

for (int i=0; i<originalValues.Count; i++) {
    TKChartVisualPoint pt = points [i];
    if (pt.Animator != null) {
        pt.Animator.RemoveAllBehaviors();
        pt.Animator = null;
    }
    pt.Center = ((CGPoint)originalValues[i]);
}

point.Center = new CGPoint (originalLocation.X, 0);

UICollisionBehavior collision = new UICollisionBehavior (points);
collision.TranslatesReferenceBoundsIntoBoundary = true;

UIGravityBehavior gravity = new UIGravityBehavior (points);
gravity.GravityDirection = new CGVector (0.0f, 2.0f);

UIDynamicItemBehavior dynamic = new UIDynamicItemBehavior (points);
dynamic.Elasticity = 0.5f;

animator.AddBehavior(dynamic);
animator.AddBehavior(gravity);
animator.AddBehavior(collision);