The "interp" Function

Syntax#

interp(a, b, amount, ease, [bx1, by1, bx2, by2]);
ArgumentTypeDescription
arealThe starting value to interpolate from
brealThe target value to interpolate to
amountrealThe amount, or percentage to interpolate between values (variable recommended)
easeinteger/macroSets the easing method for the interpolation (see options below)
[bx1]realOptional: X percentage for left control point of a cubic bezier curve (0-1)
[by1]realOptional: Y percentage for left control point of a cubic bezier curve (0-1)
[bx2]realOptional: X percentage for right control point of a cubic bezier curve (0-1)
[by2]realOptional: Y percentage for right control point of a cubic bezier curve (0-1)
[curve]curveOptional: Animation curve asset to use if ease is set to ease_curve

Description#

Returns a value interpolated between the two input values with optional easing methods to create a smooth start and/or end to animations.

The first input value should equal the original state of the value and the second input the target state of the value. For example, to move an object from x = 0 to x = 50, 0 and 50 would be the two input values here.

The third input value can be thought of as a percentage of completion. Using the same example, an input amount of 0.5 would return x = 25.

In order to create animations with this script, the interpolation amount must be input as a variable which is incremented externally.

The fourth and final value is an integer specifying the easing method used during interpolation. Simple true or false values can be used here for sine or linear interpolation, respectively, but in addition to these basic modes there are 30 different easing techniques, plus other custom techniques, featured below. Built-in easing techniques are ordered from shallowest to deepest curve.

tip

See the included interactive demo for a visual example of this function!

For memorability, it is recommended to use an easing macro from the list below in place of an integer value:

Easing MacroValueEasing MacroValue
ease_none-4ease_expo_in17
ease_sin1ease_expo_out18
ease_sin_in2ease_circ19
ease_sin_out3ease_circ_in20
ease_quad4ease_circ_out21
ease_quad_in5ease_rubber22
ease_quad_out6ease_rubber_in23
ease_cubic7ease_rubber_out24
ease_cubic_in8ease_elastic25
ease_cubic_out9ease_elastic_in26
ease_quart10ease_elastic_out27
ease_quart_in11ease_bounce28
ease_quart_out12ease_bounce_in29
ease_quint13ease_bounce_out30
ease_quint_in14ease_bezier31
ease_quint_out15ease_curve32
ease_expo16

If the bezier ease mode is selected, four more arguments can be supplied to act as control points for a custom interpolation curve. These values range from 0-1, but Y values can be less or greater to create a rubber-banding effect. See https://cubic-bezier.com/ for an interactive visual example.

Other types of curves can be created visually in GameMaker 2.3 and newer. To use these curves with interp, specify ease_curve as the mode and then supply an additional argument pointing to the animation curve asset desired. Note that only the first channel in an animation curve asset will be used.

important

Only a custom bezier curve or a custom curve asset can be input. Both cannot be input at the same time.

Example#

duration = 5;
time += delta_time/1000000;
x = interp(0, 50, time/duration, ease_quart);
y = interp(0, 50, time/duration, ease_bezier, 0.66, -0.33, 0.33, 1.33);
z = interp(0, 50, time/duration, ease_curve, my_curve);