Closed Simoneth closed 2 years ago
Hi @Simoneth this is possible, you could grab the Lottie instance and then call the goToAndPlay method:
import React from 'react';
import { Player } from '@lottiefiles/react-lottie-player';
class App extends React.Component {
constructor(props) {
super(props);
this.state = { lottie: null }; // initialize your state
this.state.lottie.playSegments([15, 35] true); //Play your segments
}
render() {
return (
<Player
lottieRef={instance => {
this.setState({ lottie: instance }); // the lottie instance is returned in the argument of this prop. set it to your local state
}}
autoplay={false}
loop={true / false depending whether you want to loop the segment or not }
controls={true}
src="https://assets3.lottiefiles.com/packages/lf20_XZ3pkn.json"
style={{ height: '300px', width: '300px' }}
></Player>
);
}
}
export default App;
I believe that this feature should be a must, start - stop animation based on frames.
Why? Because most of Lotties Files was made in loop, so most of the time you would like only half of the animation