0
早在1996年,我爲客戶創建了紡紗標識,因爲我可以,現在在2017年,我回來了,感謝Animated。Animated.loop image
<hr />
下方的代碼有效,但重啓時會出現小小的凹凸。
任何想法如何使用Animated.loop
?它不會:「」每次到達結尾時,都會重置並從開始»重新開始。
Animated.loop(
Animated.timing(this.state.spinValue, {
toValue: 1,
duration: this.props.duration,
easing: Easing.linear,
useNativeDriver: true
})
).start();
static defaultProps = {
duration: 60/(33 + 1/3) * 1000
}
constructor (props) {
super(props);
this.state = {
spinValue: new Animated.Value(0)
};
}
componentDidMount() {
this._animate();
}
_animate() {
Animated.timing(this.state.spinValue, {
toValue: 1,
duration: this.props.duration,
easing: Easing.linear,
useNativeDriver: true
}).start(event => {
if (event.finished) {
this.setState({
spinValue: new Animated.Value(0)
}, this._animate.bind(this));
}
});
}
render() {
const spin = this.state.spinValue.interpolate({
inputRange: [0, 1],
outputRange: ['0deg', '360deg']
});
return (
<View style={ Loading.style.container }>
<Animated.Image
source={ logo }
style={{ transform: [{ rotate: spin }] }}
/>
</View>
);
}
看來,庫使用'Animated.sequence'。我想堅持使用純粹的React Native。 – webjay