Graphics Reference
In-Depth Information
Figure 10.2
A cubic Bézier easing function
This would be a rather strange function in practice—it goes quickly at first, then slows
down, then speeds up at the end. So how do the standard easing functions look when
represented in graph form?
CAMediaTimingFunction
has a method
-getControlPointAtIndex:values:
that can be
used to retrieve the curve points. The design of this method is a bit quirky (why it doesn't
simply return a
CGPoint
is a mystery that only Apple can answer) but using it we can find
out the points for the standard easing functions and then plot them using
UIBezierPath
and
CAShapeLayer
.
The start and end points of the curve are always at {0, 0} and {1, 1}, respectively, so we
only need to retrieve the second and third points of the curve (the control points). The code
to do this is shown in Listing 10.4. The graphs of all of the standard easing functions are
shown in Figure 10.3.
Listing 10.4
Graphing a
CAMediaTimingFunction
Using
UIBezierPath
@interface
ViewController ()
@property
(
nonatomic
,
weak
)
IBOutlet
UIView
*layerView;