如何拉伸无法在图像上使用的属性反应本机？

Question

我已经创建了一张卡片，并且其父组件即卡片是柔性版。所以在使用alginSelf之后：'stretch'

代码：

<View style={styles.card}>
    <Image source={require('./Images/facility/facility.png')} style={styles.imgFacility}></Image>
    <TouchableHighlight>
        <Text style={styles.title}>Barasti /</Text>
    </TouchableHighlight>
</View>

CSS：

card: {
    flex: 1,
    paddingLeft: 16,
    paddingRight: 16
},
imgFacility: {
    height: 200,
    alignSelf: 'stretch'
},
title: {
    color: '#ff3385'
}

以上代码alginSelf: 'stretch'无效，为什么？可能是什么原因？

查看屏幕截图：

Answer 1

alignSelf:'stretch在上述情况下不起作用，因为应该有一个可以拉伸的块元件。

所以下面的代码可以完美地工作：

imgFacility: {
    height: 200,
    width: '100%'
}

Answer 2

如果您希望图像为全​​角，请按以下方式更改imgFacility样式：

imgFacility:{
width: Dimensions.get('window').width,
height: 200,
alignSelf: 'center'
}