Flutter Scaffold显示异常：SnackBar未在Add Screen正常显示

问题核心是SnackBar和MaterialBanner的显示依赖当前页面的ScaffoldMessenger上下文，你的情况是触发逻辑使用了Home Screen的上下文，导致提示显示在首页。以下是具体解决方法：

方法1：在Add Screen中捕获正确上下文定义函数 #

在AddScreen的代码里，直接在当前页面的上下文环境中定义_saveExpense函数，确保函数内部使用AddScreen的ScaffoldMessenger：

void _saveExpense() {
  // 执行费用保存的业务逻辑
  // ...

  // 触发SnackBar，此时context为AddScreen的上下文
  ScaffoldMessenger.of(context).showSnackBar(
    const SnackBar(content: Text('费用添加成功')),
  );
}

将这个函数传递给Keyboard.dart组件后，函数执行时会直接调用AddScreen的ScaffoldMessenger，提示就会显示在Add Screen上。

方法2：使用GlobalKey绑定Add Screen的ScaffoldMessenger #

如果函数传递时出现上下文丢失，可给AddScreen的ScaffoldMessenger设置全局Key，精准触发当前页面的提示：

1. 在AddScreen类中定义全局Key：

final GlobalKey<ScaffoldMessengerState> _addScreenScaffoldKey = GlobalKey<ScaffoldMessengerState>();

2. 在build方法中绑定Key：

@override
Widget build(BuildContext context) {
  return ScaffoldMessenger(
    key: _addScreenScaffoldKey,
    child: Scaffold(
      // AddScreen的页面内容
      // ...
      child: Keyboard(onSave: _saveExpense),
    ),
  );
}

3. 在_saveExpense中通过Key触发提示：

void _saveExpense() {
  // 费用保存逻辑
  // ...

  _addScreenScaffoldKey.currentState?.showSnackBar(
    const SnackBar(content: Text('费用添加成功')),
  );

  // MaterialBanner写法类似：
  // _addScreenScaffoldKey.currentState?.showMaterialBanner(
  //   const MaterialBanner(
  //     content: Text('费用添加成功'),
  //     actions: [TextButton(onPressed: () {}, child: Text('关闭'))],
  //   ),
  // );
}

方法3：检查导航结构 #

确保Add Screen通过Navigator正确推入导航栈，示例代码：

// 在Home Screen中打开Add Screen的代码
Navigator.push(
  context,
  MaterialPageRoute(builder: (ctx) => const AddScreen()),
);

这样AddScreen会拥有独立的导航上下文，ScaffoldMessenger能正确关联到当前页面。

内容的提问来源于stack exchange，提问作者Mujtaba Farhan