Interpolation (Easing)
When you set two keys in Rive, the frames in between those keys are automatically calculated. This is called interpolation. The interpolation can be customized to create dramatically different results.
To change the interpolation type, first select a key on the timeline. The interpolation pane will update to show how the value will change from the selected key to the next key.
The interpolation graph to the right is a visual representation of how the value will change over time from the selected key to the next. The X axis represents time (the left side is the time at the selected key, the right side is the time at the next key). The Y axis represents the change in value of the selected property from the selected key (bottom) to the next key (top).
Linear is the default interpolation type and it creates a constant rate of change from one key value to the next. If you animate the translation of a car, for example, linear interpolation would result in a car that is moving at a constant speed.
Cubic interpolation uses a curve to interpolate between key values. It gives you two handles that can be dragged to customize the curve.
The default cubic curve creates a gentle curve from the first key to the next, which results in the value changing slowly at the start and end, and changing the most exactly in the middle. If we were to apply this to the car translation mentioned earlier, the car would start slow, hit its fastest speed in the middle, and slow down again at the end.
Press
Shift when moving the interpolation handles to lock to the nearest axis.Hold doesn't interpolate values between keys. It simply holds the current value until the next key is reached, where the next value is set instantly.
Last modified 3yr ago