Animation Playback

DEPRECATION NOTICE: This entire page documents the legacy Animation Playback system. For new projects: Use State Machines instead. For existing projects: Plan to migrate from direct animation control to State Machines as soon as possible. This content is provided for legacy support only.

Rive lets you specify what animations and state machines to mix and play and control the play/pause state of each animation. The term animations may collectively refer to both animations and state machines. In this section, we explore how to deal with specific animation playback, rather than state machines.

If you are trying to coordinate multiple animations’ playback at runtime, consider using a state machine instead to do this for you!

Choosing starting animations

Starting animations can also be chosen when Rive is instantiated. The first animation on the artboard may play if one is not provided, or a state machine is not set. With the Android runtime, specify one animation with the riveAnimation property.

<app.rive.runtime.kotlin.RiveAnimationView
    app:riveAutoPlay="true"
    app:riveArtboard="Square"
    app:riveAnimation="rollaround"
    app:riveResource="@raw/artboard_animations" />

animationView.setRiveResource(
    R.raw.artboard_animations,
    artboardName = "Square",
    animationName = "rollaround",
    autoplay = true
)

Controlling playback

Playback of each animation and state machine can be separately controlled. You can play and pause playback using the play , pause and stop methods, either passing in the names of the animations you want to affect or passing in nothing which will affect all instanced animations.

Invoking playback controls

After setting the Rive Resource with your animation view, you can invoke animation playback control methods. Along with programmatically playing an animation, you can also choose the loop mode and direction of the animation as additional parameters as needed. You can additionally pause or stop an animation as well.

// Play one animation
animationView.play("rollaround")

// Set loop mode and direction
animationView.play("rollaround", Loop.ONE_SHOT, Direction.Backwards)

animationView.pause()
animationView.pause("bouncing")

animationView.stop()
animationView.stop("bouncing")

Animation event listeners

The Rive Android runtime also allows listener registration. Check out the events section in the rive player for an example of how this works.

val listener = object : Listener {
    override fun notifyPlay(animation: PlayableInstance) {
        var text: String? = null
        if (animation is LinearAnimationInstance) {
            text = animation.name
        }
    }

    override fun notifyPause(animation: PlayableInstance) {
        var text: String? = null
        if (animation is LinearAnimationInstance) {
            text = animation.name
        }
    }

    override fun notifyStop(animation: PlayableInstance) {
        var text: String? = null
        if (animation is LinearAnimationInstance) {
            text = animation.name
        }
    }

    override fun notifyLoop(animation: PlayableInstance) {
        var text: String? = null
        if (animation is LinearAnimationInstance) {
            text = animation.name
        }
    }
}
animationView.registerListener(listener)

Check out this Activity example: LoopModeActivity.kt

Runtimes

Integrations

Animation Playback

Choosing starting animations

Controlling playback

Invoking playback controls

Animation event listeners

​Choosing starting animations

​Controlling playback

​Invoking playback controls

​Animation event listeners

Choosing starting animations

Controlling playback

Invoking playback controls

Animation event listeners