底部导航栏中的可扩展浮动操作按钮 - Flutter

Question

我正在尝试实现以下设计

当我将可扩展的浮动按钮添加到底部导航栏的凹槽时，它破坏了底部导航栏的设计。

我尝试了 AnchorOverlay 但没有帮助。 下面是我的主屏幕的代码，其中可扩展小部件位于底部应用栏中

@override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: kPrimaryColor,
      floatingActionButton: ExpandableFab(
        distance: 112.0,
        children: [
          ActionButton(
            onPressed: () {},
            icon: const Icon(Icons.format_size),
          ),
          ActionButton(
            onPressed: () {},
            icon: const Icon(Icons.insert_photo),
          ),
          ActionButton(
            onPressed: () {},
            icon: const Icon(Icons.videocam),
          ),
        ],
      ),
      floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
      bottomNavigationBar: BottomAppBar(
        //bottom navigation bar on scaffold
        color: Colors.redAccent,
        shape: const CircularNotchedRectangle(), //shape of notch
        notchMargin:
            5, //notche margin between floating button and bottom appbar
        child: Row(
          //children inside bottom appbar
          mainAxisSize: MainAxisSize.max,
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: <Widget>[
            IconButton(
              icon: const Icon(
                Icons.menu,
                color: Colors.white,
              ),
              onPressed: () {},
            ),
            IconButton(
              icon: const Icon(
                Icons.search,
                color: Colors.white,
              ),
              onPressed: () {},
            ),
            IconButton(
              icon: const Icon(
                Icons.print,
                color: Colors.white,
              ),
              onPressed: () {},
            ),
            IconButton(
              icon: const Icon(
                Icons.people,
                color: Colors.white,
              ),
              onPressed: () {},
            ),
          ],
        ),
      ),
    );
  }

Answer 1

请参考此https://codewithandrea.com/articles/adding-animated-overlays-to-your-app/也许您的问题将得到解决。