Flutter 包中的暗模式 - Dart

Flutter是Google创建的移动应用开发框架，允许开发者通过单一的代码库构建高性能、高保真度的iOS和Android应用。随着操作系统提供了暗模式的支持，Flutter框架也提供了暗模式的支持。

如何启用 Flutter 中的暗模式？

Flutter在2.0版本中增加了暗模式支持。简单地说，你只需要在MaterialApp或CupertinoApp的构造函数中指定themeMode属性为ThemeMode.dark。例如：

MaterialApp(
  themeMode: ThemeMode.dark,
  // 其他属性
)

这将启用暗模式，如下图所示：

Flutter 暗模式的实现原理

Flutter中的暗模式依赖于以下三个重要组件：

• MediaQuery
• Theme
• InheritedWidget

MediaQuery组件提供了设备信息、自定义主题、文本比例因子等。其中，我们需要知道的是，MediaQuery提供了设备当前所用主题的信息。

Theme提供了定义Material应用程序的各种视觉组件的方法，包括颜色、形状和字体。为了支持暗模式，Flutter的Theme组件提供了一个dark主题。

InheritedWidget允许数据在组件之间共享。在Flutter的暗模式中，InheritedWidget用于在整个应用程序中传递当前主题。

综上所述，Flutter暗模式的实现原理是：将ThemeMode作为InheritedWidget的数据共享，当主题模式变化时，Flutter会重新构建整个Widget树。

小结

Flutter提供了轻松地开启暗模式的方法。使用themeMode: ThemeMode.dark即可开启暗模式。实现原理则是在三个重要组件（MediaQuery、Theme、InheritedWidget）之间传递数据。