使用showDatePicker设置locale属性时报No MaterialLocalizations found错误如何解决

问题原因 #

报错No MaterialLocalizations found是两个问题叠加导致的：

• 你的Scaffold放在MaterialApp之外，当前传入showDatePicker的context无法获取到MaterialApp提供的本地化资源实例
• 新增阿拉伯语locale配置后，系统需要加载对应语言的Material组件文本，默认的MaterialApp配置没有包含多语言支持

解决步骤 #

1. 调整组件树结构 #

所有Material系列组件（包括showDatePicker）都依赖MaterialApp提供的全局配置、主题、本地化资源，必须把承载业务逻辑的Scaffold放到MaterialApp的子节点中，不能放在MaterialApp之外。
基础结构示例：

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      // 后续本地化配置放在此处
      home: YourPageScaffold(), // 把原来放在外部的Scaffold移到这里
    );
  }
}

2. 配置多语言支持 #

要使用阿拉伯语等非默认语言的Material组件本地化，需要先添加依赖并配置对应参数：
首先在pubspec.yaml中添加本地化依赖：

dependencies:
  flutter:
    sdk: flutter
  flutter_localizations: 
    sdk: flutter

之后在MaterialApp中添加本地化配置：

MaterialApp(
  localizationsDelegates: [
    GlobalMaterialLocalizations.delegate,
    GlobalWidgetsLocalizations.delegate,
    GlobalCupertinoLocalizations.delegate, // 用到iOS风格组件可添加
  ],
  supportedLocales: [
    const Locale('ar'), // 加入你需要的阿拉伯语locale
    const Locale('en'), // 可按需添加其他支持的语言
  ],
  // 原有theme、home等配置保持不变
)

3. 修正代码语法问题 #

你贴的代码中initialDate: from后缺少逗号，补上避免语法报错：

onPressed: () async {
  String timeMsg = 'اختر التوقيت';
  DateTime? _selectDate = await showDatePicker(
    context: context,
    locale: const Locale('ar'),
    initialDate: from, // 此处补上逗号
    firstDate: first,
    lastDate: DateTime.now(),
  );
}

完成以上配置后重新运行项目，即可正常弹出阿拉伯语的日期选择器，不会再抛出本地化缺失的错误。

内容的提问来源于stack exchange，提问作者Mohammad Alamoudi