React Nativeの縮尺イメージ

Question

スケールイメージはHTMLのようです。反応性ネイティブのimg {height:100%; width:100%}。

私はresizeMode?: enum('cover', 'contain', 'stretch', 'repeat', 'center')を試しましたが、私の場合は動作しません。

<View style={{ 
    flex: 1, 
    alignItems: 'center', 
    justifyContent: 'center', 
    paddingTop: Constants.statusBarHeight, 
    backgroundColor: '#ecf0f1', 
    flexDirection:'row' 
    }}> 
     <View style={{flex:1, backgroundColor:'yellow'}}> 
     <Image 
      style={{width: 50, height: 50}} 
      resizeMode="stretch" 
      source={{uri: 'http://aristotlebuzz.com/wp-content/uploads/2017/01/Facebook.png'}} 
     /> 
     </View> 
     <View style={{flex:1, backgroundColor:"red"}}> 
      <Text>afdafda</Text> 
     </View> 

     </View> 

https://snack.expo.io/ByhjFQo1M

Answer 1

あなたは画像のコンテナに{height: 50}を追加する必要が ...

...と{flex: 1}

...と呪文に画像サイズを設定しますstretch正しく。で

<View style={{flex: 1, backgroundColor: 'yellow'}}> 
    <Image 
    style={{width: 50, height: 50}} 
    resizeMode="strech" 
    source={{uri: 'http://aristotlebuzz.com/wp-content/uploads/2017/01/Facebook.png'}} 
    /> 

を：：

ので交換してください

<View style={{flex: 1, height: 50, backgroundColor: 'yellow'}}> 
    <Image 
    style={{flex: 1}} 
    resizeMode="stretch" 
    source={{uri: 'http://aristotlebuzz.com/wp-content/uploads/2017/01/Facebook.png'}} 
    />