Graphics Reference
In-Depth Information
Figure 10.1
A graph of the linear easing function
The slope of this line represents the velocity of change. Changes in the slope represent
acceleration or deceleration. In principle, any sort of acceleration curve can be represented
on a graph like this, but
CAMediaTimingFunction
uses a specific function known as a
cubic
Bézier curve,
which can only produce a specific subset of easing functions. (We previously
encountered cubic Bézier curves in Chapter 8 when we used them to create a
CAKeyframeAnimation
path.)
As you may recall, a cubic Bézier curve is defined by four points: The first and last points
indicate the starting and ending points for the curve, and the two middle points are called
control points
, because they control the shape of the curve. The control-points of a Bézier
curve are
off-curve
points, meaning that the curve does not necessarily pass through them.
You can think of these points as acting like magnets that
attract
the curve as it passes them.
Figure 10.2 shows an example of a cubic Bézier easing function.
