Flutter中的SVG异常被SVG捕获

Question

我正在使用最新的库更新

\n\n

dependencies:\n  flutter_svg: ^0.17.4\n

\n\n

\n\nContainer( height: 150, //color: Colors.blue, width: screenWidth * 0.80, child: SvgPicture.asset( "assets/logo-violeta-NVIAME-login.svg", color: Color(0xFF6327f8), ), ),\n------------------------------------------------------------------------\n\n

\n\n

我的代码有效，但我进行了热重启..并且我得到以下异常

\n\n

The <style> element is not implemented in this library.\n\nStyle elements are not supported by this library and the requested SVG may not render as intended.\n\nIf possible, ensure the SVG uses inline styles and/or attributes (which are supported), or use a preprocessing utility such as svgcleaner to inline the styles for you.\n\n\nPicture key: AssetBundlePictureKey(bundle: PlatformAssetBundle#60537(), name: "assets/logo-violeta-NVIAME-login.svg", colorFilter: ColorFilter.mode(Color(0xff6327f8), BlendMode.srcIn))\n\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\nI/flutter (26058): unhandled element metadata; Picture key: AssetBundlePictureKey(bundle: PlatformAssetBundle#60537(), name: "assets/logo-violeta-NVIAME-login.svg", colorFilter: ColorFilter.mode(Color(0xff6327f8), BlendMode.srcIn))\n

\n\n

\n

Answer 1

它实际上是您使用的 SVG 图像。

正如错误中提到的：

The <style> element is not implemented in this library.

Style elements are not supported by this library and the requested SVG may not render as intended.

If possible, ensure the SVG uses inline styles and/or attributes (which are supported), or use a preprocessing utility such as svgcleaner to inline the styles for you.

flutter_svg包不支持svg内部 css，例如：

 <style>
       .....
  </style>

这是一个开放的 GitHub 问题，表明尚不支持它。

您实际上可以尝试的一些选项：

• 删除internal css并写入inline css
• 使用不同的svg图片
• 使用预处理实用程序，例如svgcleaner为您内联样式。这正是您在评论中找到的那个。另请参阅此帖子。
• 使用这个工具https://jakearchibald.github.io/svgomg/

但最简单的方法是尽可能让你的设计工具不使用 CSS。