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