在反应本机组件中有独立的内容

我已经创建了一个React Native组件，并为它添加了一些动画。现在，当我用该元素包围其他元素（例如：文本）时，文本也会获取动画。如何避免这种情况？我想让我的组件具有动画，但它的内部组件保持静止。在反应本机组件中有独立的内容

MYIMAGE组件代码：

return (
    <Image 
     defaultSource={{uri: './placeholder.jpg'}} 
     source={this.props.sourceUri} 
     style={imageStyle}> 
     <View>{this.props.children}</View> 
    </Image> 
);

实现：

<MyImage imageWidth={Dimensions.get('window').width} imageHeight={Dimensions.get('window').height/100 * 30} sourceUri={{uri: item.image}}> 
    <View style={styles.nameContainer}> 
     <Text style={styles.textMain}>{item.name}</Text> 
    </View> 
</MyImage>

如何实现这一目标？

来源

2016-01-13 Nimila Hiranya

而不是让您的自定义组件儿童的图像，他们必须在同一水平，绝对定位。 MyImage会非常粗略的看起来像这样：

<View style={{ ... apply width and height ..., position: 'relative' }}> 
    <Image style={{ top:0, bottom:0, left:0 right: 0, position: 'absolute' }} /> 
    <View style={{ top:0, bottom:0, left:0 right: 0, position: 'absolute' }}>this.props.children}</View> 
</View>

来源

2016-01-14 05:24:42

在反应本机组件中有独立的内容

回答

相关问题