Open valeriiamykhalova opened 1 year ago
Animation does not restart immediately on calling animationRef.current?.play(). It works as expected on Android, but not on IOS
import { useRef, useState } from 'react' import { View, StyleSheet, Button, Text } from 'react-native' import LottieView from 'lottie-react-native' export function Animation() { const [counter, setCounter] = useState(0) const animationRef = useRef() function playAnimation() { animationRef.current?.play() setCounter(counter + 1) } return ( <View style={styles.container}> <LottieView ref={animationRef} style={styles.animation} loop={false} autoPlay={false} source={require('assets/animations/egg.json')} /> <View style={styles.buttonContainer}> <Button title="Play" onPress={playAnimation} /> <Text style={styles.text}>Pressed {counter} times</Text> </View> </View> ) } const styles = StyleSheet.create({ container: { flex: 1, backgroundColor: 'pink', }, animation: { flex: 1, }, buttonContainer: { position: 'absolute', left: 0, right: 0, bottom: 200, justifyContent: 'center', alignItems: 'center', }, text: { paddingTop: 24, fontWeight: '500', }, })
Expected behavior: I expect the animation to restart immediately after pressing the "Play" button. It works as expected on Android
https://user-images.githubusercontent.com/29245376/229546563-2fea8a8b-4e1c-4c3d-9bcc-d21001967d52.mp4
Actual behavior: Animation does not restart until it reaches the last frame
https://user-images.githubusercontent.com/29245376/229546773-5853d83b-7b95-4853-a874-56b6fe09e096.mp4
"lottie-ios": "3.4.0" "lottie-react-native": "^5.1.5" "react-native": "0.69.5"
I feel like the Android API is not working correctly in this case. We have a method called reset which should be used for these cases. play should simply continue playing, not reset anything. @matinzd ?
reset
play
Description
Animation does not restart immediately on calling animationRef.current?.play(). It works as expected on Android, but not on IOS
Steps to Reproduce
Expected behavior: I expect the animation to restart immediately after pressing the "Play" button. It works as expected on Android
https://user-images.githubusercontent.com/29245376/229546563-2fea8a8b-4e1c-4c3d-9bcc-d21001967d52.mp4
Actual behavior: Animation does not restart until it reaches the last frame
https://user-images.githubusercontent.com/29245376/229546773-5853d83b-7b95-4853-a874-56b6fe09e096.mp4
Versions
"lottie-ios": "3.4.0" "lottie-react-native": "^5.1.5" "react-native": "0.69.5"