
我想制作回圈影片
回圈(
1.淡入影像 0.5秒 2.使
影像可見 2.5 秒
3.淡出影像 0.5 秒
4.使影像不可見 2.5 秒
)
但結果很奇怪,我檢測到我的影像眨。
const fadeAni = useRef<Animated.Value>(new Animated.Value(0)).current;
useEffect(() => {
Animated.loop(
Animated.sequence([
Animated.timing(fadeAni, {
toValue: 1,
duration: 500,
useNativeDriver: true,
}),
Animated.delay(2500),
Animated.timing(fadeAni, {
toValue: 0,
duration: 500,
useNativeDriver: true,
}),
Animated.delay(2500),
]),
).start()
}, [])
return (
<Animated.View style={{ opacity: fadeAni }}>
<ImageBackground source={imageSource} style={styles.area}>
</ImageBackground>
</Animated.View>
);
我的代碼有什么問題以及如何實作制作正確的影片?
uj5u.com熱心網友回復:
啊,我得到了你的問題,這是因為你沒有fadeIn在 useEffect 中傳遞依賴項。
const fadeAni = useRef<Animated.Value>(new Animated.Value(0)).current;
useEffect(() => {
Animated.loop(
Animated.sequence([
Animated.timing(fadeAni, {
toValue: 1,
duration: 500,
useNativeDriver: true,
}),
Animated.delay(2500),
Animated.timing(fadeAni, {
toValue: 0,
duration: 500,
useNativeDriver: true,
}),
Animated.delay(2500),
]),
).start()
}, [fadeAni])
return (
<Animated.View style={{ opacity: fadeAni }}>
<ImageBackground source={imageSource} style={styles.area}>
</ImageBackground>
</Animated.View>
);
現在試試。我試過了。請查看世博小吃
轉載請註明出處,本文鏈接:https://www.uj5u.com/net/486441.html
