时间戳

首页 > 解决方案 > 如何将 SVG 添加到 Flutter 中的 AppBar 类？

flutter - 如何将 SVG 添加到 Flutter 中的 AppBar 类？

问题描述

我希望能够在我的颤振应用程序中向 AppBar 添加一个 svg 图像。我使用了一个名为 flutter_svg 的包将 svg 添加到项目中，但是图像没有出现在项目中。main中的代码如下：

class FrontpageState extends State<Frontpage> {
//mother widget
  Widget build(BuildContext context) {
    final Widget svgJuro = SvgPicture.asset(juro);
    final Widget svgBanco = SvgPicture.asset(banco, semanticsLabel: 'Banco');
    final Widget svgGoverno =
        SvgPicture.asset(titulos, semanticsLabel: 'Titulos');
    final Widget svgFundos = SvgPicture.asset(fundos, semanticsLabel: 'Fundos');
    final Widget svgQuestao =
        SvgPicture.asset(questao, semanticsLabel: 'Questão');

    return Scaffold(
        appBar: AppBar(
      shadowColor: jBrown100,
      title: Align(
          alignment: Alignment(-0.6, 0),
          child: Text('JURAS?',
              style: GoogleFonts.roboto(
                  color: jBlack100,
                  fontSize: 48,
                  fontWeight: FontWeight.w700,
                  letterSpacing: -2))),
      actions: [
        new IconButton(icon: svgJuro, onPressed: null, color: jPink100)
      ],
    ));
  }

依赖项中的代码和一个单独的资产 dart 文件：

dependencies:
  flutter:
    sdk: flutter
  google_fonts: ^1.1.1
  flutter_svg: ^0.19.1

//assets.dart

final String juro = 'imgAsset/juro.svg';
final String banco = 'imgAsset/banco.svg';
final String titulos = 'imgAsset/governo.svg';
final String fundos = 'imgAsset/fundos.svg';
final String questao = 'imgAsset/questao.svg';

我将 SVG 放入动作中是因为我想在未来为 SVG 制作动画。我认为我可以实现这一点的唯一方法是通过使用容器的自定义 appbar，这是我正在尝试实现的设计，请给我任何关于使这个设计成为现实的建议： 标头应用

预先感谢您的帮助。

标签： flutterdartsvg

解决方案

只需确保您的图像是 .svg 格式 [使用转换器转换为 .svg 格式]。在尝试显示 .png 图像时，我遇到了与提到的类似的问题。

推荐阅读