svg 图像作为颤振中的按钮

Question

我创建了一个播放按钮并将其保存为 svg 文档。

我还创建了我的主屏幕，背景是一张图片，一个浮动操作按钮居中。（我为此使用了堆栈）。

import 'package:flutter/material.dart';

    class MyBackgroundWidget extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return new Stack(
          children: <Widget>[
            new Container(
                child: new Image.asset('assets/Backgr.png'),
                width: double.infinity,
                height: double.infinity),
            Center(
              child: new FloatingActionButton(
                  child: new Icon(Icons.arrow_right),
                  backgroundColor: new Color(0xFFE57373),
                   onPressed: () {}),
        ),

      ],
    );
  }
}

我的问题是：我可以使用我的 svg-image 作为按钮而不是当前的 floatActionButton 吗？如果是的话，我能否获得一些帮助，或者我应该从哪里开始寻找如何做到这一点？

我仍然想要我的背景图片和一个居中的按钮:)

谢谢！

Answer 1

如果你想创建一个可点击的图标，用 IconButton 包围你的 Svg，你将提供 onTap 方法，如下所示：

child: IconButton(
        icon: SvgPicture.asset(
          'path to your asset',
        ),
        onPressed: null //do something,
      ),

Answer 2

您可以使用Gesture Detector向 Flutter 中的任何 Widget 添加点击功能：

GestureDetector(
  onTap: () {
    print("onTap called.");
  },
  child: Text("foo"),
),

子 svg Widget 就像使用这个库一样简单（因为 Flutter 仍然没有原生 SVG 支持）：https : //pub.dev/packages/flutter_svg