import Svg, { Polygon, Text as SvgText, TextPath } from 'react-native-svg';
import { Text } from 'react-native';
[...]
<Text>react-native Text</Text>
<Svg>
<SvgText>react-native-svg Text</SvgText>
</Svg>
[...]
We were actually just struggling with an issue related to this. SVG text (web and native) has really limited options (basically none) for expanding a parent to fit text, and react-native-svg specifically doesn’t support foreignobject (the ability to embed non-SVG in SVG), so react native’s Text becomes just about the only practical way to show a variable-sized box with text in conjunction with SVG markup. The easiest way we’ve found so far is with an absolute-positioned component with the react native markup over the SVG markup, with both in a View with a specific height and width (because SVG will demand that), e.g.,