Flutter系统亮度检测完全指南：MediaQuery.platformBrightnessOf() 的妙用

基本概念

MediaQuery.platformBrightnessOf(context) 用于获取当前操作系统的亮度模式，而不是应用的主题模式。

返回值

· Brightness.light：系统当前是亮色模式
· Brightness.dark：系统当前是暗色模式

基本用法

// 获取系统亮度
Brightness systemBrightness = MediaQuery.platformBrightnessOf(context);// 判断是否是暗色模式
bool isSystemDark = systemBrightness == Brightness.dark;print('系统亮度模式: $systemBrightness'); // Brightness.light 或 Brightness.dark

与主题提供的区别

方法 来源 用途
MediaQuery.platformBrightnessOf(context) 操作系统设置 获取系统当前的亮度模式
Theme.of(context).brightness 应用主题 获取应用当前的主题亮度
Provider.of(context).isDarkMode 用户选择 获取用户选择的主题状态

实际应用场景

1. 根据系统亮度设置UI

@override
Widget build(BuildContext context) {Brightness systemBrightness = MediaQuery.platformBrightnessOf(context);bool isSystemDark = systemBrightness == Brightness.dark;return Container(color: isSystemDark ? Colors.black : Colors.white,child: Text('当前系统是${isSystemDark ? "暗色" : "亮色"}模式',style: TextStyle(color: isSystemDark ? Colors.white : Colors.black,),),);
}

2. 系统导航栏适配

SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(systemNavigationBarColor: MediaQuery.platformBrightnessOf(context) == Brightness.dark ? Colors.black : Colors.white,systemNavigationBarIconBrightness: MediaQuery.platformBrightnessOf(context) == Brightness.dark ? Brightness.light : Brightness.dark,),
);

3. 跟随系统主题的组件

Widget build(BuildContext context) {final systemBrightness = MediaQuery.platformBrightnessOf(context);return Icon(Icons.brightness_auto,color: systemBrightness == Brightness.dark ? Colors.white : Colors.black,);
}

结合用户主题选择的完整方案

Widget build(BuildContext context) {final themeProvider = Provider.of<ThemeProvider>(context);final systemBrightness = MediaQuery.platformBrightnessOf(context);// 确定最终主题：如果用户选择"跟随系统"，就用系统亮度final bool actualIsDarkMode;if (themeProvider.themeMode == ThemeMode.system) {actualIsDarkMode = systemBrightness == Brightness.dark;} else {actualIsDarkMode = themeProvider.themeMode == ThemeMode.dark;}// 应用主题设置SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(systemNavigationBarColor: actualIsDarkMode ? Colors.black : Colors.white,systemNavigationBarIconBrightness: actualIsDarkMode ? Brightness.light : Brightness.dark,),);return Scaffold(backgroundColor: actualIsDarkMode ? Colors.black : Colors.white,// ... 其他代码);
}

注意事项

1. 实时性：系统亮度改变时会自动重建widget
2. 平台支持：在所有平台都有效
3. 性能：调用成本很低，可以放心在build方法中使用
4. 与Theme的区别：不要和Theme.of(context).brightness混淆

常见错误用法

// ❌ 错误：混用系统亮度和主题亮度
SystemUiOverlayStyle(systemNavigationBarColor: MediaQuery.platformBrightnessOf(context) == Brightness.dark ? Colors.black : Colors.white,systemNavigationBarIconBrightness: Theme.of(context).brightness == Brightness.dark  // 混用了！? Brightness.light : Brightness.dark,
)

最佳实践

// 在需要根据系统设置（而不是应用主题）调整UI时使用
final systemBrightness = MediaQuery.platformBrightnessOf(context);// 在需要根据用户最终选择的主题调整UI时，使用统一的判断逻辑
final actualTheme = themeProvider.themeMode == ThemeMode.system? MediaQuery.platformBrightnessOf(context): (themeProvider.themeMode == ThemeMode.dark ? Brightness.dark : Brightness.light);

总结：MediaQuery.platformBrightnessOf(context) 主要用于获取系统级别的亮度设置，适合需要跟随系统外观的场景。