Quelle est la meilleure pratique pour déclencher un événement lorsque Animated.spring se termine?
Animated.spring(this.state.pan, {
toValue: 0
}).start()
J'ai cherché pas mal et je n'ai pas trouvé un seul moyen de le faire. Je pourrais utiliser addListener pour vérifier si l'animation a atteint sa valeur finale ou un délai d'expiration, mais ils se sentent tous les deux comme de vilains correctifs à ce qui devrait être super simple.
Est-ce que quelqu'un sait?
Réponses:
Une demi-heure de recherche sur Google plus tard et j'ai trouvé cela, je ne peux pas croire qu'ils ne l'ont pas mieux documenté.
https://github.com/facebook/react-native/issues/3212
.start(callback)
Cela sera déclenché au début de l'animation
.start(console.log("Start Animation")
En utilisant une fonction ou une fonction de flèche, done sera appelé à la FIN de l'animation
.start(() => {console.log("Animation DONE")})
Et enfin c'est à quoi cela ressemble dans le contexte d'une fonction.
_play(){
Animated.timing(this.state.progress, {
toValue: 1,
duration: 5000,
easing: Easing.linear,
}).start(() => {console.log("Animation DONE")});
}
J'espère que ça t'as aidé!
En gros, ces trois approches permettent de faire quelque chose lorsqu'une animation se termine. Premièrement: vous pouvez utiliser le callback passé en méthode call (callback). Deuxièmement: vous pouvez utiliser stopAnimation qui accepte également un rappel Troisième: Ma méthode préférée, qui consiste à placer un écouteur sur la valeur animée, et à faire quelque chose en fonction de la valeur actuelle. Par exemple, vous pouvez faire une traduction de 0 à 150 et en fonction d'une valeur que vous animez, dites «mouvement» et lorsque le mouvement atteint une valeur, vous pouvez effectuer quelque chose.
let motion = Animated.Value(0);
motion.addListener(({value}) =>{
if(value>=10){
pos.stopAnimation((val)=>{console.log('stopped in '+val)});
}
});
En savoir plus sur👉https: //www.youtube.com/channel/UCl5-W0A8tE3EucM7E_yS62A
.start(console.log("Start Animation")"se déclenchera" uniquement au début d'une animation à cause d'un effet secondaire. Ceci est fonctionnellement identique àconsole.log("Start Animation"); Animated.timing(...).start(..). Ce n'est pas l'utilisation intentionnelle de la méthode. Merci de ne pas l'utiliser.start()prend un rappel pour quand l'animation se termine et c'est tout.