0
У меня есть простая кнопка изображения, которая меняет свое изображение на TouchStart и onRelease. В iOS он работает так, как ожидалось, но на Android кнопка мигает, когда изображение меняется. Похоже, если изображение нужно загружать снова каждый раз, когда я касаюсь его.React Native - почему моя кнопка изображения вспыхивает на Android?
class MyApp extends React.Component {
constructor(props) {
super(props);
}
render() {
return (
<View style={ styles.container }>
<ImageButton
style={ styles.button }/>
</View>
);
}
}
class ImageButton extends React.Component {
constructor(props: {}) {
super(props);
this.image = {
normal: require('./img/button.png'),
highlight: require('./img/button-touched.png')
};
this.state = {
image: this.image.normal
};
}
onTouchStart() {
// do some stuff
// set the highlighted image
this.setState({
image: this.image.highlight
});
}
onTouchEnd() {
this.setState({
image: this.image.normal
})
}
onTouchCancel() {
this.setState({
image: this.image.normal
});
}
componentWillReceiveProps(nextProps) {
this.setState({
image: nextProps.image.normal
});
}
render() {
return (
<View style={ this.props.style }
onStartShouldSetResponder={() => true }
onResponderGrant={ this.onTouchStart.bind(this) }
onResponderRelease={ this.onTouchEnd.bind(this) }
onResponderTerminate={ this.onTouchCancel.bind(this) }
onResponderReject={ this.onTouchCancel.bind(this) }>
<Image style={ styles.image } source={ this.state.image } resizeMode="stretch" />
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#E4E4E4',
},
button: {
backgroundColor: 'transparent',
},
});
AppRegistry.registerComponent('schwein',() => Schwein);