React-Native에서 주어진 너비의 이미지 종횡비를 유지하는 방법은 무엇입니까?

Question

이미지 갤러리에서 작업 중입니다. 행당 3 개의 이미지를 ListView에 표시해야합니다. 나는 폭이 무슨 짓을

renderCategory(category) { 
    return (
     <Image source={{uri: category.image}} style={styles.image}> 
      <Text style={styles.headline}>{category.name}</Text> 
     </Image> 
    ); 
    } 
    render() { 
    return (
     <View> 
     <Button title="Back" color="#5c6bc0" onPress={this.onPress}/> 
     <ListView dataSource={this.state.dataSource} renderRow={this.renderCategory} contentContainerStyle={styles.list_view}/> 
     </View> 
    ); 
    } 

여기

image: { 
     height: 110, 
     width: Dimensions.get('window').width/3 
} 

열심히 이미지 높이를 cording하고있다. 반응 네이티브에서 주어진 너비로 이미지 높이를 조정할 수 있습니까?

Answer 1

샘플 코드 : 예

image: { 
    width: Dimensions.get('window').width/3 - 10 , 
    height: Dimensions.get('window').width/3 - 10, 
    margin:5, 
    resizeMode: 'contain', 

} 

Answer 2

, 원본 이미지의 폭/높이 500 픽셀 X 1000 픽셀 인 경우. 그리고 정적 너비로 가로 세로 라디오를 유지하려고합니다.

const radio = 1000/500; 
const static_width = Dimensions.get('window').width/3; 

image: { 
    height: static_width * radio, 
    width: static_width; 
} 

희망 도움말.