在 flutter 中渲染时出现 SVG 图像错误

Kee*_*har 5 icons svg dart flutter

它显示这样的错误消息。 解析 AssetBundlePictureKey(bundle: PlatformAssetBundle#9940f(), name: "assets/icons/academy.svg", colorFilter: null, theme: SvgTheme(currentColor: null, fontSize: 14.0, xHeight: 7.0)) 时抛出以下断言在 _getDefinitionPaint 中:找不到 url 的定义(#pattern0)

该库仅支持在引用之前定义的 xlink:href 引用。

当所需的定义在引用它的元素之后(例如在文件末尾)定义或在另一个文件中定义时,可能会导致此错误。

此错误被视为非致命错误,但您的 SVG 文件可能不会按预期呈现

我的 SVG 文件包含图像 image.svg

<svg width="69" height="69" viewBox="0 0 69 69" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<rect x="16" y="19" width="37" height="31" fill="url(#pattern0)"/>
<defs>
<pattern id="pattern0" patternContentUnits="objectBoundingBox" width="1" height="1">
<use xlink:href="#image0_42_579" transform="translate(0 -0.030613) scale(0.00221729 0.00264645)"/>
</pattern>
<image id="image0_42_579" width="451" height="401" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAcMAAAGRCAYAAAAZwNgiAAAgAElEQVR4Aex9B3iV1Zb2NzN35s7cf+7c+8/8c1VARUSaIgiIBRAVRdELtotdJCfoVa9iA6lJvvTek5Oek957L6T33nsjvRACXDcN74r1xD7gX3BPuDfeIe+3s55LfEwQEAUX5/+1kjN9Wr/KbAAAAAElFTkSuQmCC"/>
</defs>
</svg>
Run Code Online (Sandbox Code Playgroud)

并且 image.svg 在 display.dart 中显示为

class Display extends StatelessWidget {
  const Display({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('icons')),
      body: Column(
        children: [
          SvgPicture.asset(
            'assets/images/image.svg',
            height: 400.0,
            width: 300.0,
            allowDrawingOutsideViewBox: true,
          ),
        ],
      ),
    );
  }
}
Run Code Online (Sandbox Code Playgroud)

Jin*_*eph 3

使用前请检查您的 SVG

请通过链接

https://www.svgviewer.dev/

您的图片有一些问题