Как установить ширину изображения равной 100% и высоту, чтобы быть автоматически в реагировать родной?

Я пытаюсь отобразить список изображений в виде прокрутки. Ширина должна быть 100%, а высота должна быть автоматической, сохраняя пропорции.

Поиски, которые я делал, указывали на различные решения, которые дают полноэкранный стиль фона.

const styles = StyleSheet.create({
    image: {
        width: null,
        height: 300,
        resizeMode: 'cover'
    }
});

<ScrollView style={{flex: 1}}>
    <Image style={styles.image} source={require('../../../images/collection-imag1.png')}/>
    <Image style={styles.image} source={require('../../../images/collection-imag2.png')}/>
</ScrollView>

Я пробовал различные комбинации ширины: null, height: null, flex: 1, alignSelf и т. Д. Приведенное выше решение почти работает, за исключением того, что высота не является динамической. Части изображения не видны.

Ответы на вопрос(4)

Ваш ответ на вопрос