Question

我试图在容器中使用svg图像作为背景，并且使用此包“ flutter_svg”，但找不到用于在装饰中设置它的Provider方法。

    Container(
              margin: EdgeInsets.symmetric(horizontal: 5),
              width: 60,
              height: 20,
              decoration: BoxDecoration(
                color: currentColor.medium,
                borderRadius: BorderRadius.circular(4),
                image: DecorationImage(
                  image: SvgPicture.asset('assets/images/home.png'),
                ),
              ),
);

不能将参数类型'SvgPicture'分配给参数类型'ImageProvider'.dart（argument_type_not_assignable）

所以我不知道如何在这里使用svg作为ImageProvider

Answer 1

有两种选择：

首先，为此编写一个函数，如 here 处的 flutter_svg 包中所述：

final String rawSvg = '''<svg viewBox="...">...</svg>''';
final DrawableRoot svgRoot = await svg.fromSvgString(rawSvg, rawSvg);

final Picture picture = svgRoot.toPicture();
final Image image = await picture.toImage(width, height);
return RawImage(image, 1.0);

第二个，在 svg_flutter 包之上使用另一个 package：

import 'package:flutter_svg_provider/flutter_svg_provider.dart';

Image(
  width: 32,
  height: 32,
  image: Svg('assets/my_icon.svg'),
)

Answer 2

Flutter开发人员创建了一个库，您可以在这里找到 https://www.developerlibs.com/2019/06/flutter-draw-svg-vector-drawables.html

无法将SvgPicture分配给ImageProvider

2 个答案: