I am using Expo and React Native and I want to display a Lottie animation. On iOS this works like a charm - on Android the animation will play once and then it will not play again. It seems that reset() somehow behaves strange.
What am I doing wrong here? You can also have a look at a corresponding Expo snack.
import { Button, View } from 'react-native';
import React, { useRef } from 'react';
import LottieView from 'lottie-react-native';
import likeAnimation from './assets/animation.json';
export default function App() {
const animation = useRef(null);
const onPress = () => {
animation.current.play();
};
const onAnimationFinish = () => {
animation.current.reset();
}
return (
<View style={{ paddingTop: 200, backgroundColor: '#dddddd', flex: 1 }}>
<LottieView
loop={false}
speed={1.5}
autoSize
ref={animation}
source={likeAnimation}
onAnimationFinish={onAnimationFinish}
/>
<Button onPress={onPress} title="Click me!" />
</View>
);
}