试试这个：

import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    String svgString = '''
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="1080" height="500" viewBox="0 0 1080 500" xml:space="preserve">
<defs>
</defs>
<g transform="matrix(1 0 0 1 540 540)" id="8c766263-7764-4e86-b9a4-b2e3930bc2c2"  >
<rect style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,255,255); fill-rule: nonzero; opacity: 1; visibility: hidden;" vector-effect="non-scaling-stroke"  x="-540" y="-540" rx="0" ry="0" width="1080" height="1080" />
</g>
<g transform="matrix(1 0 0 1 540 540)" id="78c73894-81ea-4bfa-93f9-772aa0957680"  >
</g>
<g transform="matrix(-14.81 0 0 -14.81 540 -20.88)" id="16b0c9d9-48d4-4230-9fb3-b57678935c9d"  >
<path style="stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(101,101,101); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke"  transform=" translate(-50, -50)" d="M 18.315 23.231 L 81.684 23.231 C 84.294 23.231 86.48 25.084000000000003 86.48 27.400000000000002 L 86.48 60.235 C 86.48 62.504 84.29400000000001 64.403 81.684 64.403 L 54.877 64.403 L 38.035 76.77 L 44.42999999999999 64.405 L 18.315 64.405 C 15.650000000000002 64.405 13.519000000000002 62.506 13.519000000000002 60.237 L 13.519000000000002 27.401 C 13.519 25.084 15.651 23.231 18.315 23.231 z" stroke-linecap="round" />
</g>
</svg>
''';

    return MaterialApp(
      title: 'Material App',
      home: Scaffold(
        body: Stack(children: [
          Padding(
            padding:
                EdgeInsets.only(top: MediaQuery.of(context).size.width * 0.35),
            child: ListView(
              children: [
                ...List.generate(
                  20,
                  (index) => ListTile(
                    title: Text('Item $index'),
                    onTap: () {},
                  ),
                ),
              ],
            ),
          ),
          SvgPicture.string(
            svgString,
            width: MediaQuery.of(context).size.width,
          ),
        ]),
      ),
    );
  }

字符串

的数据

您可以按照以下方法来实现效果：

1.在列表视图中去掉填充

通常，列表视图中有填充。您可以通过以下方式删除：

padding: EdgeInsets.zero,

字符串

2. svg周围的空间

您需要在编辑器中裁剪SVG。图像或SVG周围有空格，您需要裁剪以删除此内容。要删除SVG周围的空格，请单击this链接。

3.使用Stack控件

如果上面的解决方案都不起作用，你可以使用Stack小部件。在堆栈中你可以使用Positioned来调整列表视图，你可以给予任何你想要的位置。

您可以通过使用MediaQuery.removePadding小部件 Package ListView并将removeTop设置为true来删除它的默认顶部填充。

return MediaQuery.removePadding(
    context: context,
    removeTop: true,
    child: ListView.builder(
     .......
    )
  );

字符串