core-animationbezier

Using CAMediaTimingFunction to calculate value at time (t)

In Cocoa/Touch, CAMediaTimingFunction represents four control points that specify a cubic bezier curve of a timing function. For an application I am writing I would like to be able to extract the result of said bezier curve at an arbitrary time t (0 -> 1). What is confusing me is that when I look up how to do this, the result is supposed to be a point as well, not a scalar:

B(t) = (1 - t) ^ 3 * P0 + 3 * (1 - t) ^ 2 * t * P1 + 3 * (1 - t) * t ^ 2 * P2 + t ^ 2 * P3

However, Apple's implementation results in a scalar value (you can see on this graph they plot x(t) vs t: http://developer.apple.com/library/mac/#documentation/Cocoa/Conceptual/Animation_Types_Timing/Articles/Timing.html#//apple_ref/doc/uid/TP40006670-SW1 )

So does Apple simply ignore the y coordinate of the result and only deal with the x? This seems strange because then you wouldn't need to pass in control points but rather control scalars as the y's wouldn't influence the result at all.

Solution

  • Note: I am not an expert on CoreAnimation. This is just my understanding from reading the docs you have linked.

    Apple is mixing coordinate systems here, which is creating some confusion.

    x(t) in the example plots represents a scalar progression along some path, not a physical coordinate.

    The control points used in CAMediaTimingFunction are used to describe this progression, not a geometric points. To add to the confusion, x in the control points actually maps to t on the plots and y in the control points to x(t) on the plots.

    To take the plot for kCAMediaTimingFunctionEaseInEaseOut as an example, this plot would be described roughly by control points (0,0), (0.5,0), (0.5,1), (1,1).