Flutter 圆形波纹效果 : How to build beautiful material BottomNavigationBar

作为 Google stadia app is made with flutter，我想知道他们是如何在 BottomNavigationBar 上实现更漂亮的波纹动画的。
例子:

他们是如何实现自定义涟漪动画的？
编辑:简单的自定义BottomNavigationItem:

bottomNavigationBar: Container(
      height: 50,
      child: Row(
        children: <Widget>[
          Expanded(
            child: BottomItem(),
          ),
          Expanded(
            child: BottomItem(),
          ),
          Expanded(
            child: BottomItem(),
          ),
        ],
      )),

class BottomItem extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return InkWell(
      onTap: () {},
      child: Center(child: Icon(Icons.shop)),
    );
  }
}

最佳答案

您正在寻找的 Ink 是 InkResponse 而不是 InkWell 。 InkWell 用高光填充整个可用空间，然后进行飞溅，但是 InkResponse 使用您正在寻找的圆形效果进行飞溅，您需要稍微调整一下，但这是代码示例:

Material(
  child: Container(
    child: Center(
       child: InkResponse(
            focusColor: Colors.transparent,
            hoverColor: Colors.transparent,
            highlightColor: Colors.transparent,
            onTap: () {},
            child: Padding(
              padding: const EdgeInsets.all(30),
              child: Icon(Icons.home),
            ),
          ),
        ),
      ),
    )

| InkWell | InkResponse 默认值 InkResponse 自定义 |

关于Flutter 圆形波纹效果 : How to build beautiful material BottomNavigationBar，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/61703352/