如何require()在React Native中显示我的SVG图像.
什么是显示图像的最佳方式(不需要操纵它).
或者我应该将其转换为png而不是?
最简单的方法是什么?我发现很多svg到JSX转换器,这是我想要的,但是在react-native中不起作用。我需要将svg代码转换为可以使用react-native-svg在我的应用程序中显示的内容。谢谢!
我想从 illustrator 生成的 SVG 文件中渲染图像,我使用的是react-native 0.59、react-native-svg和react-native-svg-uri,这是我的jsx:
<View style={styles.aboutSection}>
<SvgUri
width="150"
height="150"
source={require('../../assets/images/logo_blue.svg')}
/>
</View>
Run Code Online (Sandbox Code Playgroud)
和我的 SVG 文件:
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Calque_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="-574 823.3 20 14" style="enable-background:new -574 823.3 20 14;" xml:space="preserve">
<style type="text/css">
.st0{fill:#2A327B;}
</style>
<g>
<g transform="translate(-320.000000, -1983.000000)">
<g transform="translate(40.000000, 1680.000000)">
<path class="st0" d="M-284,1140.3c-7.4,0-10-7-10-7s3.4-7,10-7c6.7,0,10,7,10,7S-277.3,1140.3-284,1140.3L-284,1140.3z
M-284,1129.3c-2.2,0-4,1.8-4,4s1.8,4,4,4s4-1.8,4-4S-281.8,1129.3-284,1129.3L-284,1129.3z M-284,1135.3c-1.1,0-2-0.9-2-2
s0.9-2,2-2s2,0.9,2,2S-282.9,1135.3-284,1135.3L-284,1135.3z"/>
</g>
</g>
</g>
</svg>
Run Code Online (Sandbox Code Playgroud)
并且在调试时没有显示我缺少的内容以及是否有更好的方法来显示 SVG …
我需要将矢量(.svg)图像插入到本机应用程序中。请问你能帮帮我吗。
我不知道如何实现这一目标,并且似乎本机反应不支持svg。
任何帮助将不胜感激。