как сделать компонент дисклеймер

Question

Как сделать вот такой компонент на react native? Причем чтобы иконку в дальнейшем можно было бы переместить по пропсу в любой угол?

Проблема в том, что независимо от разрешения слова должны врапаться, и во вложении я прикрепил, что рядом с иконой 2 строчки потом переваливается вниз весь оставшийся текст

Answer 1

Получается примерно так

<View>
     <Text>
       <Image
         style={{
           width: 40,
           height: 40,
           borderRadius: 20
         }}
         // Please. use the correct source =))
         source={require('image.jpg')}
       />
       Тест тест тест тест тест Тест тест тест тест тест Тест тест тест тест
       тест Тест тест тест тест тест Тест тест тест тест тест
     </Text>
</View>

Если как компонент оформить:

const Disclaimer = ({ text, imageSource}) => {
 return (
    <View>
      <Text>
       <Image
         style={{
           width: 40,
           height: 40,
           borderRadius: 20
         }}
         // Please. use the correct source =))
         source={imageSource)}
       />
       {text}
     </Text>
    </View>
 )
}

Но в данном случае будет только в одну строку картинка и текст, если прям как нарисовано, то нужно костылить под конкретный текст, покажу абстрактно без некоторых обязательных опций:

<View>
    <View style={{flexDirection: 'row'}}>
       <Image/> 
       <View>
          <Text>Тут текст в две строки</Text>
       </View>
    </View>
    <Text>продолжение текста</Text>
</View>

БЛОГ НА HUSL

как сделать компонент дисклеймер

Ответы (1 шт):