Open supergianlu opened 2 years ago
Hi @supergianlu, thanks for making this ticket, will work on getting a fix out shortly. In the meanwhile, you can get the animation playing in reverse this way:
import React from "react";
import "./styles.css";
import { Player } from "@lottiefiles/react-lottie-player";
class App extends React.Component {
constructor(props) {
super(props);
this.state = { lottie: null }; // initialize your state
}
render() {
return (
<div className="App">
<Player
lottieRef={(instance) => {
this.setState({ lottie: instance }); // the lottie instance is returned in the argument of this prop. set it to your local state
}}
onEvent={(event) => {
if (event === "load") {
this.state.lottie.setDirection(-1);
}
}}
autoplay={true}
loop={true}
controls={true}
src="https://assets3.lottiefiles.com/packages/lf20_UJNc2t.json"
style={{ height: "300px", width: "300px" }}
></Player>
</div>
);
}
}
export default App;
sandbox here:
https://codesandbox.io/s/lottie-react-direction-test-ysj6p?file=/src/App.js
Try adding keepLastFrame
to the Player as props
This issue has been automatically marked as stale because it has not had recent activity. It will be closed in 7 days if no further activity occurs.
Something new here?
Up issue, direction doens't worked
Nearing 9 months now, is the baby coming?
@supergianlu for your workaround, do you have a suggestion for how to do it with functional components? I couldn't seem to get it to work 🥺
I'm having the same problem. direction={-1}
is not working, setting keepLastFrame
doesn't help.
I'm having the same issue 😢
@supergianlu for your workaround, do you have a suggestion for how to do it with functional components? I couldn't seem to get it to work 🥺
Did you find a workaround for functional components?
This issue has been automatically marked as stale because it has not had recent activity. It will be closed in 7 days if no further activity occurs.
Is this still not working? This has been open for an entire year....
Edit: make that two years
This issue has been automatically marked as stale because it has not had recent activity. It will be closed in 7 days if no further activity occurs.
Adding
direction={-1}
nothing happen.