Question

我创建了一个播放按钮，并将其另存为svg文件。

我还创建了主屏幕，其中的背景图片和居中的floatActionButton。（我为此使用了堆栈）。

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图像用作按钮，而不是当前的floatActionButton吗？如果是，请问我如何获得此帮助，或者我应该从哪里寻找如何做到这一点？

我仍然希望背景图片和居中按钮：）

谢谢！

Answer 1

您可以使用Gesture Detector向Flutter中的任何窗口小部件添加点击功能：

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

并且子svg窗口小部件就像使用此lib一样简单（因为flutter仍然不支持本机SVG）： https://pub.dev/packages/flutter_svg

Answer 2

如果要创建可点击的图标，请使用IconButton将Svg环绕起来，然后提供了onTap方法，例如：

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

Answer 3

您可以使用InkWell向Flutter中的任何小部件添加点击功能：

InkWell(
  onTap: () {
    print("onTap function."); 
  }, 
  child: Icon( 
     CstomIcon.custico, 
  ),
),

请参阅此帖子Flutter SVG rendering，将svg添加为图标，并将SVG放入InkWell的子项

svg图像作为颤动中的按钮

3 个答案: