React-Nativeで画像の周りにテキストを折り返す

Question

Imageコンポーネントを囲むImageコンポーネントとTextコンポーネントでViewを作成しようとしています。

マイスタイリング：

textContainer: { 
    flexDirection: 'row', 
    }, 
    text: { 
    flex: 10, 
    }, 
    image: { 
    flex:1, 
    height: 180, 
    width: 150,  
    margin: 10, 
    borderColor: '#ccc', 
    borderWidth: 1, 
    } 

マイコンポーネント：

<ScrollView style={styles.contentContainer} > 
    {this.props.content.title_1 ? <Text style={styles.title}>{this.props.content.title_1}</Text> : null} 
    <View style={styles.textContainer}> 
     {this.props.content.text_1 ? <Text style={styles.text}>{this.props.content.text_1}</Text> : null} 
     {this.props.content.image_1 ? <Image width={null} height={null} style={styles.image} source={this.props.content.image_1} /> : null} 
    </View> 
</ScrollView> 

これはどのような結果である：の下の画像で

を（がまったく笑ラッピング不可）ここで、私はすぐに小さなイメージをテキストにハッキングしました。しかし、私は誰もが正しい方向に私を助けることができると思います

..テキストの周りにラップさせることはできません！

Answer 1

これは本当に難しいですが、これを行うには奇妙な方法があります。以下を試してみてください。それは私のために働いたが、私はこれを行うと、他のビューではあまりにも深いです。：

<Text> 
    <View style={{width:400, height:100, flex:1, flexDirection:'row'}}> 
    <Image source={require('')}/> 
    <Text>Your Content Here</Text> 
    </View> 

</Text> 

幸運。私たちにそれが働いたかどうかを知らせてください。あなたは、テキスト内のビューを配置することはできませんが、画像を配置することができますAndroid上

Answer 2

は、ここでの例です：

<Text> 
    <Image source="" /> 
    <Text> Insert your text here </Text> 
</Text>