Flutter：Stack组件内FloatingActionButton无法跳转至下一页面

Stack组件的子Widget遵循后添加则上层渲染的规则，你的主FloatingActionButton被放在Stack的children列表末尾，导致它始终覆盖在所有展开的子按钮之上。点击子按钮时，实际触发的是主按钮的_toggleMenu方法，而非子按钮的导航逻辑。

将主FloatingActionButton移至Stack的children列表最顶部，让展开的子按钮渲染在主按钮上层，确保点击事件能被正确响应。

修改后的Stack代码片段：

floatingActionButton: Stack (
  alignment: Alignment.topLeft,
  children: <Widget>[
    // 主按钮移到最前，让子按钮在其上层渲染
    FloatingActionButton(
      onPressed: _toggleMenu,
      child: Icon(Icons.menu),
    ),
    menuItems(Icons.message, 0, () {
      print('Message button pressed');
      Navigator.push(
        context,
        MaterialPageRoute(builder: (context) => SecondScreen()),
      );
    }),
    menuItems(Icons.call, 1, () {
      print('Call button pressed');
      Navigator.push(
        context,
        MaterialPageRoute(builder: (context) => ThirdScreen()),
      );
    }),
    menuItems(Icons.photo, 2, () {
      print('Photo button pressed');
      Navigator.push(
          context,
          MaterialPageRoute(builder: (context) => ForthScreen()),
        );
    }),
  ],
),

顺便修正ForthScreen类中的打印错误：

class ForthScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // 原代码错误打印了ThirdScreen，修正为ForthScreen
    print('ForthScreen built');
    return Scaffold(
      appBar: AppBar(
        title: Text('Forth Screen'),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            Navigator.pop(context);
          },
          child: Text('Go Back'),
        ),
      ),
    );
  }
}

调整后，子按钮的导航功能会正常生效，动画效果不受影响。

内容的提问来源于stack exchange，提问作者Minh Pham