Обертывание текста вокруг изображения с помощью React-Native

Question

Я пытаюсь создать компонент 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> 

Удачи. Пожалуйста, разместите комментарий, сообщив нам, если он сработает.

Answer 2

На андроид вы не можете поместить вид внутри текста, но вы можете поместить изображение, вот пример:

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