Я создал карту и родительский компонент, то есть карта является гибкой. Итак, после использования 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' не работает, почему так? Что может быть причиной ?

Смотрите скриншот:

enter image description here

2
fun joker 24 Сен 2018 в 20:00

2 ответа

Лучший ответ

Если вы хотите, чтобы ваше изображение было полноширинным, измените стиль imgFacility следующим образом:

imgFacility:{
width: Dimensions.get('window').width,
height: 200,
alignSelf: 'center'
}
1
Mojtaba Moshfeghi far 24 Сен 2018 в 17:53

alignSelf:'stretch не работает в приведенном выше случае, потому что должен быть элемент блока, который нужно растянуть.

Итак, приведенный ниже код отлично работает:

imgFacility: {
    height: 200,
    width: '100%'
}
1
fun joker 24 Сен 2018 в 17:46