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

Question

如 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)),
    );
  }
}

Answer 1

墨水您要找的是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 自定义 |