Показывать изображение в соотношении 4: 5 и помещать его в вид контейнера в оригинальном формате

Question

Мне неизвестно соотношение изображений, загруженных пользователем заранее, но мне нужно отобразить все изображения в формате 4: 5, т.е.

image width=device window width size 
image height=(device window width size)*5/4

Я использовал приведенные выше расчеты для отображения моего изображения внутри контейнера, но изображение обрезается. Если я использую режим изменения размера, изображение искажается.

Код:

<View style={styles.container}>
      <Image style={styles.fixedRatio} source={{ uri: this.props.navigation.state.params.uri }}/>
    </View>

    container: {
      flex: 1,
      flexDirection: 'row',
      alignItems: 'center',
      justifyContent: 'center'
    },
    fixedRatio: {
      marginLeft:-10,
      marginRight:-10,
      backgroundColor: 'red',
      flex: 1,
      aspectRatio: 1,
      width: deviceWidth,
      height: deviceWidth*5/4
    },

Редактировать 1:

Согласно ответу @marson, я изменил код, как показано ниже

Я установил цвет фона, чтобы различать изображения. Теперь изображения не обрезаются. Но не вписывается в вид

<View style={{ backgroundColor: 'blue', aspectRatio:4/5, alignSelf:'center', width: '100%'}}>
   <Image resizeMode={'contain'} style={{width:'100%', height:'100%'}} source={{ uri: this.props.navigation.state.params.uri }}/>
</View>

Answer 1

Может ли это работать?

<View style={{
  width: '100%',
  aspectRatio={4.0/5.0}
}}>
  <Image
    style={{
      width: '100%',
      height: '100%',
    }}
    resizeMode={'contain'}
    source={...}/>
</View>