Flutter 如何在FloatingActionButton停靠在Flatter中时弹出菜单

我想创建一个底部栏，其中有一个中间停靠的FloatingActionButton，单击该按钮时，会弹出许多其他导航按钮

按钮和弹出按钮工作正常，但我无法单击当时可见的按钮。 在我实现了这个按钮的页面上，在折叠的按钮下面有一个ListView，我似乎通过按钮点击ListView元素

所以我的问题是： 我如何让它们成为可点击的

这是我的密码：

class MainNavigationButton extends StatefulWidget {
  @override
  _MainNavigationButtonState createState() => _MainNavigationButtonState();
}

class _MainNavigationButtonState extends State<MainNavigationButton> with SingleTickerProviderStateMixin {
  AnimationController animationController;
  Animation positionAnimation;
  Animation rotationAnimation;

  @override
  void initState() {
    animationController =
        AnimationController(vsync: this, duration: Duration(milliseconds: 250));
    degOneTranslationAnimation =
        Tween(begin: 0.0, end: 1.0).animate(animationController);
    rotationAnimation =
        Tween<double>(begin: 180.0, end: 0.0).animate(CurvedAnimation(
      parent: animationController,
      curve: Curves.easeOut,
    ));

    super.initState();

    animationController.addListener(() {
      setState(() {});
    });
  }

  @override
  Widget build(BuildContext context) {
    return Stack(
      children: [
        CoinFlipButton(context),
        DiceRollButton(context),
        HauntRevealButton(context),
        MenuButton(
          color: backgroundColor,
          width: 60,
          height: 60,
          icon: Icon(
            Icons.menu,
            color: Colors.white,
          ),
          onPressed: () {
            if (animationController.isCompleted)
              animationController.reverse();
            else
              animationController.forward();
          },
        ),
      ],
    );
  }

  Widget CoinFlipButton(context) {
    return Transform.translate(
      offset: Offset.fromDirection(
          GetRadiansFromDegree(-86), positionAnimation.value * 60),
      child: Transform(
        transform:
            Matrix4.rotationZ(GetRadiansFromDegree(rotationAnimation.value))
              ..scale(positionAnimation.value),
        alignment: Alignment.center,
        child: MenuButton(
          color: backgroundColor,
          width: 50,
          height: 50,
          icon: Icon(
            Icons.attach_money,
            color: Colors.white,
          ),
          onPressed: () {
            debugPrint("Coinflip");
            Navigator.of(context)
                .push(MaterialPageRoute(builder: (context) => CoinFlip()));
          },
        ),
      ),
    );
  }

  Widget DiceRollButton(context) {
    return Transform.translate(
      offset: Offset.fromDirection(
          GetRadiansFromDegree(-20), positionAnimation.value * 70),
      child: Transform(
        transform:
            Matrix4.rotationZ(GetRadiansFromDegree(rotationAnimation.value))
              ..scale(positionAnimation.value),
        alignment: Alignment.center,
        child: MenuButton(
          color: backgroundColor,
          width: 50,
          height: 50,
          icon: Icon(
            Icons.keyboard,
            color: Colors.white,
          ),
          onPressed: () {},
        ),
      ),
    );
  }

  Widget HauntRevealButton(context) {
    return Transform.translate(
      offset: Offset.fromDirection(
          GetRadiansFromDegree(-157), positionAnimation.value * 60),
      child: Transform(
        transform:
            Matrix4.rotationZ(GetRadiansFromDegree(rotationAnimation.value))
              ..scale(positionAnimation.value),
        alignment: Alignment.center,
        child: MenuButton(
          color: backgroundColor,
          width: 50,
          height: 50,
          icon: Icon(
            Icons.translate,
            color: Colors.white,
          ),
          onPressed: () {
            debugPrint("Haunt button pressed");
          },
        ),
      ),
    );
  }

  double GetRadiansFromDegree(double degree) {
    double unitRadians = 57.295779513;
    return degree / unitRadians;
  }
}

class MenuButton extends StatelessWidget {
  final double width;
  final double height;
  final Icon icon;
  final Color color;
  final Function onPressed;

  MenuButton({this.width, this.height, this.icon, this.color, this.onPressed});

  @override
  Widget build(BuildContext context) {
    return Container(
      width: width,
      height: height,
      child: MaterialButton(
        shape: BeveledRectangleBorder(borderRadius: BorderRadius.circular(20)),
        color: color,
        child: icon,
        onPressed: onPressed,
      ),
    );
  }
}

我不希望在底部导航栏中有单独的按钮，因为这与我在其他一些页面上的设计相冲突，在这些页面中，我使用TabBarView，底部有导航，并且嵌入了此MainMenuButton

Scaffold(
  [other stuff]
  floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
  floatingActionButton: MainNavigationButton(),
  bottomNavigationBar: BottomBar(child: Container(height: 60, color: backgroundColor))
  //Or a BottomAppBar with a TabBar on some pages
)