我是 React Native 的新手,我有以下组件:
<View style={{flex: 1}}>
<View style={styles.container}>
<Animated.Image style= {styles.photo}
source={{uri: this.props.user.picture.large}}/>
</View>
<View style={{backgroundColor:'whitesmoke', flex: 1}}></View>
</View>
在样式中,我有以下内容:
const styles = StyleSheet.create({
container: {
flex: 0.5,
backgroundColor: '#4dbce9',
alignItems: 'center',
},
photo: {
height: 150,
width: 150,
borderRadius: 75,
borderWidth: 3,
borderColor: 'white',
transform: [ // `transform` is an ordered array
{scale: this.state.profileImgBounceVal},
]
}
});
我访问时出现错误this.state.profileImgBounceVal
因为它在我所知道的组件之外。除了包含样式内的样式之外,是否有任何解决方法Animated.Image
tag?
你可以使用Stylesheet.flatten() https://facebook.github.io/react-native/docs/stylesheet.html#flatten在组件中创建可重用的样式对象:
var animatedImageStyle = StyleSheet.flatten([
styles.photo,
{
transform: [{scale:this.state.profileImgBounceVal}]
}
])
<View style={{flex: 1}}>
<View style={styles.container}>
<Animated.Image style={animatedImageStyle}
source={{uri: this.props.user.picture.large}}/>
</View>
<View style={{backgroundColor:'whitesmoke', flex: 1}}></View>
</View>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)