Animated.spring이 끝날 때 이벤트를 트리거하는 가장 좋은 방법은 무엇입니까?
Animated.spring(this.state.pan, {
toValue: 0
}).start()
나는 꽤 많이 검색했지만 그것을 수행하는 단일 방법을 찾지 못했습니다. addListener를 사용하여 애니메이션이 종료 값 또는 시간 초과에 도달했는지 확인할 수 있지만 둘 다 매우 간단해야하는 것에 대한 추악한 수정처럼 느껴집니다.
아는 사람 있나요?
답변
30 분 후에 인터넷 검색을했는데 이걸 발견했는데 더 잘 문서화하지 않았다는 게 믿기지 않습니다.
https://github.com/facebook/react-native/issues/3212
.start(callback)
답변
애니메이션이 시작될 때 실행됩니다.
.start(console.log("Start Animation")
화살표 기능이나 기능을 사용하여에 불려가는 끝났 END 애니메이션
.start(() => {console.log("Animation DONE")})
그리고 마지막으로 이것이 함수의 맥락에서 보이는 모습입니다.
_play(){
Animated.timing(this.state.progress, {
toValue: 1,
duration: 5000,
easing: Easing.linear,
}).start(() => {console.log("Animation DONE")});
}
도움이 되었기를 바랍니다.
답변
기본적으로 애니메이션이 완료 될 때 작업을 수행하는 세 가지 접근 방식이 있습니다. 첫째 : call (callback) 메서드에 전달 된 콜백을 사용할 수 있습니다. 두 번째 : 콜백도받는 stopAnimation을 사용할 수 있습니다. 세 번째 : 애니메이션 값에 리스너를 배치하고 현재 값에 따라 작업을 수행하는 제가 선호하는 방법입니다. 예를 들어 0에서 150까지 변환하고 애니메이션 값을 기반으로 ‘모션’이라고 말하고 모션이 값에 도달하면 무언가를 수행 할 수 있습니다.
let motion = Animated.Value(0);
motion.addListener(({value}) =>{
if(value>=10){
pos.stopAnimation((val)=>{console.log('stopped in '+val)});
}
});
👉https : //www.youtube.com/channel/UCl5-W0A8tE3EucM7E_yS62A에 대한 자세한 내용