Interpolation

Scellow edited this page Sep 21, 2016 · 4 revisions

Interpolation

Commonly known as tweening, interpolation is useful for generating values between two discrete end points using various curve functions. Often used with key-framed animation, interpolation allows an animator to specify a sparse collection of explicit frames for an animation and then generate a smooth transition between these frames computationally. The simplest form of interpolation is linear interpolation such as that available directly in the Vector2 (code) and Vector3 (code) classes. The Interpolation (code) class provides more interesting results by using non-linear curve functions to interpolate values.

Types of Interpolation

These are the basic built-in types of interpolation:

  • Bounce
  • Circle
  • Elastic
  • Exponential
  • Fade
  • Power
  • Sine
  • Swing

Code Example

// Written in Kotlin

val easAlpha:Interpolation = Interpolation.fade
val lifeTime:Int = 2
var elapsed:Float = 0f
..
fun update(delta:Float)
{
    elapsed += delta

    val progress = Math.min(1f, elapsed/lifeTime)   // 0 -> 1 
    val alpha = easAlpha.apply(progress)
}

Most types offer three varieties which bias towards one or the other or both ends of the curve creating an easing in or out of the animation.

See InterpolationTest for a visual display of each interpolation.

Visual display of interpolations

bounce bouncein bounceout circle
bounce bouncein bounceout circle
circlein circleout elastic elasticin
circlein circleout elastic elasticin
elasticout exp5 exp5in exp5out
elasticout exp5 exp5in exp5out
exp10 exp10in exp10out fade
exp10 exp10in exp10out fade
linear pow2 pow2in pow2out
linear pow2 pow2in pow2out
pow3 pow3in pow3out pow4
pow3 pow3in pow3out pow4
pow4in pow4out pow5 pow5in
pow4in pow4out pow5 pow5in
pow5out sine sinein sineout
pow5out sine sinein sineout
swing swingin swingout -
swing swingin swingout -

Table of Contents

Clone this wiki locally
You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.
Press h to open a hovercard with more details.