export default class extends Component {
constructor(props) {
super(props)
this.state = {
value: new Animated.Value(0)
}
}
componentDidMount() {
this.AnimateRotate()
}
AnimateRotate() {
this.state.value.setValue(0)
Animated.timing(this.state.value, {
toValue: 1,
duration: 15000,
easing:Easing.out(Easing.linear)
}).start(() => {
this.AnimateRotate()
})
}
render() {
const animateRotate = this.state.value.interpolate({
inputRange: [0, 1],
outputRange: ['0deg', '360deg']
})
return (
<View style ={{justifyContent: 'center', alignItems: 'center'}}>
<Animated.Image style ={[{transform: [{rotateZ: animateRotate}]},this.props.style]} source={this.props.imageSrc} >
</Animated.Image>
</View>
)
}
}
上方代码是一个循环旋转的图片,怎么控制它的停止呢,
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…