Animator

The <Animator /> component can be used to control the animation of a 3D asset.

Example:

import { Model, Animator } from 'react-native-filament'

<Model source={require('path/to/asset_with_animations.gltf')}>
    <Animator
        // The animation index to play (alternatively you can provide a useSharedValue)
        animationIndex={0}
        onAnimationsLoaded={(animations) => {
            // The animations have been loaded
        }}
    />
</Model>

When switching between animations you might want to transition / blend between the animation (so that the mesh is transitioning from animation A to B). You can specify the transitionDuration prop to control the duration of the transition. A duration of 0 will make the transition instant.

For pausing the animation it is recommended to render the <Animator /> component conditionally (e.g. based on a state variable).