【RN】画像は、幅または高さ

RNのバージョンを設定していないときは表示されませ。これを行う方法。【RN】画像は、幅または高さ

<View style={styles.container}> 
    <Image style={styles.image} source={{uri : 'https://www.baidu.com/img/bd_logo1.png'}}> 
    </Image> 
</View> 



const styles = StyleSheet.create({ 
    container: { 
    flex: 1 
    }, 
    image: { 
    flex: 1, 
    resizeMode: 'contain' 
    }, 
});

出典

2016-12-01 youhan26

'画像試し：{フレックス：1、幅：ヌル、高さ：ヌル}'スタイルのために。 – zvona

ネットワークイメージでは、高さ/幅スタイルの小道具を設定する必要があります。

React Native Documentation。

アプリに表示される画像の多くは、コンパイル時に利用できません、またはあなたがバイナリサイズを抑えるために、動的に一部をロードすることになるでしょう。 静的リソースとは異なり、に手動でイメージのサイズを指定する必要があります。

// GOOD 
<Image source={{uri: 'https://facebook.github.io/react/img/logo_og.png'}} 
     style={{width: 400, height: 400}} /> 

// BAD 
<Image source={{uri: 'https://facebook.github.io/react/img/logo_og.png'}} />

出典

2016-12-01 13:23:27

ええ、ありがとう。しかし、Pinterestレイアウトを実現するには？1。どのようにウィンドウの親要素の幅を取得するには？ 2.ギャラリーを保存するために 'resizeMode'を使った後に空白を取り除く方法はありますか？ありがとうございました – youhan26

[Dimensions]（https://facebook.github.io/react-native/docs/dimensions.html）APIを使うことができます。ウィンドウの高さ/幅を取得し、行/セルの数などに基づいて手動でイメージサイズを計算します。 –

【RN】画像は、幅または高さ

答えて

関連する問題