我是新的反应原生,我在列表视图中显示GIF图像的列表,我在什么图像角圆形我试图用正常图像做它并且它正在工作但是使用GIF图像它不起作用我现在不用这是为什么。
我使用下面的样式和代码来制作圆角。
<ListView contentContainerStyle={styles.list}
showsHorizontalScrollIndicator={false}
horizontal= { true }
dataSource={this.state.dataSource}
ref={ref => this.listView = ref}
renderRow={(rowData) => {
return (
<TouchableOpacity style={styles.item} onPress={() => this.stickerSelected(rowData)}>
<Image style={styles.image} source={this.props.images[rowData].src}/>
</TouchableOpacity>
)
}}
/>
list: {
justifyContent: 'center',
flexDirection: 'column',
backgroundColor: '#FFFDEB',
flexWrap: 'wrap',
paddingLeft: 6,
paddingRight: 6
},
item: {
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#EAD62F',
borderRadius: 10,
margin: 3,
width: 75,
height: 75,
},
image: {
width: 75,
height: 75,
borderRadius: 10,
}
并尝试在图片和项目样式中添加以下属性以解决重叠问题但角落仍为方形。
overflow: 'hidden',
答案 0 :(得分:2)
您需要设置overlayColor样式。它在这里描述https://facebook.github.io/react-native/docs/image.html#style
image: {
width: 75,
height: 75,
borderRadius: 10,
overlayColor: 'white',
}