Animating things from A to B using linear motion is easy, but boring. Much more interesting and realistic animations are created using different easing curves. Core Animation and UIKit have nice API’s to do this, but when interpolating yourself you’ll have to resort to some math.

A quick search (goog, duck) returns a set of animation curves implemented by Jeff LaMarche. However as I found out some of those functions are incorrect. The comments for that post provide a few corrections, but not for all functions.

For this reason I implemented my own set of interpolation functions.

I decided to implement Quadratic, Cubic, Exponential and Sinusoidal easing functions. This is the same set also provided by certain Quartz Composer patches. See the interactive graph for more details on each of the individual curves.

Each of the functions returns the interpolation between start and end for the given input time (where time is between 0.0 to 1.0).

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

CGFloat JKLinearInterpolation(CGFloat t, CGFloat start, CGFloat end);

CGFloat JKQuadraticInInterpolation(CGFloat t, CGFloat start, CGFloat end);
CGFloat JKQuadraticOutInterpolation(CGFloat t, CGFloat start, CGFloat end);
CGFloat JKQuadraticInOutInterpolation(CGFloat t, CGFloat start, CGFloat end);

CGFloat JKCubicInInterpolation(CGFloat t, CGFloat start, CGFloat end);
CGFloat JKCubicOutInterpolation(CGFloat t, CGFloat start, CGFloat end);
CGFloat JKCubicInOutInterpolation(CGFloat t, CGFloat start, CGFloat end);

CGFloat JKExponentialInInterpolation(CGFloat t, CGFloat start, CGFloat end);
CGFloat JKExponentialOutInterpolation(CGFloat t, CGFloat start, CGFloat end);
CGFloat JKExponentialInOutInterpolation(CGFloat t, CGFloat start, CGFloat end);

CGFloat JKSinusoidalInInterpolation(CGFloat t, CGFloat start, CGFloat end);
CGFloat JKSinusoidalOutInterpolation(CGFloat t, CGFloat start, CGFloat end);
CGFloat JKSinusoidalInOutInterpolation(CGFloat t, CGFloat start, CGFloat end);

Code

The code is available from the jk-interpolation git repo over at bitbucket.

This repository also contains one Xcode project used to generate the data for the above graph.