dart - Flutter中是否有可能 "extend"ThemeData

Question

我很可能会错过一些东西，因为我对 Flutter 很陌生，但我发现 ThemeData 的选项非常有限(至少在我对如何实现它的理解的情况下)。

如果你从 MaterialUp 看下面这个随机设计，我想大致建模一些东西:


Themedata.cyclingColor = Color.pink;
ThemeData.runningColor = 颜色.green;


这样，我可以在我的应用程序的任何地方引用自行车、运行、游泳、健身房的颜色(或任何在我的应用程序/设计上下文中有意义的颜色)并保持一致。

目前在 Flutter 中是否有推荐的方法来实现这一点？我有哪些选择？

Answer 1

我推荐这种方法，它很简单，适用于热重载，并且可以轻松扩展以支持在深色和浅色主题之间切换。

首先创建您自己的 ThemeData 的模拟，我们称之为AppThemeData :

class AppThemeData {
  final BorderRadius borderRadius = BorderRadius.circular(8);

  final Color colorYellow = Color(0xffffff00);
  final Color colorPrimary = Color(0xffabcdef);

  ThemeData get materialTheme {
    return ThemeData(
        primaryColor: colorPrimary
    );
  }
}

materialTheme可以在任何时候使用标准 ThemeData需要。

然后创建一个名为 AppTheme 的小部件，它提供了 AppThemeData 的实例使用 provider包。

class AppTheme extends StatelessWidget {
  final Widget child;

  AppTheme({this.child});

  @override
  Widget build(BuildContext context) {
    final themeData = AppThemeData(context);
    return Provider.value(value: themeData, child: child);
  }
}

最后，用 AppTheme 封装整个应用程序.要访问主题，您可以调用context.watch<AppThemeData>() .或者创建这个扩展...

extension BuildContextExtension on BuildContext {
  AppThemeData get appTheme {
    return watch<AppThemeData>();
  }
}

... 并使用 context.appTheme .我通常把 final theme = context.appTheme;在小部件构建方法的第一行。