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

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

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

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

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

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

最佳答案

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

首先创建您自己的 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;在小部件构建方法的第一行。

https://stackoverflow.com/questions/49172746/

相关文章:

flutter - 在 FutureBuilder 中设置提供者值

flutter - 小部件测试失败,未找到任何 MediaQuery 小部件

dart - 错误状态 : Mock method was not called within `w

android - 为什么我的 Flutter 应用的 ListView 滚动不如 Flutter

flutter - Flutter 目录不是 GitHub 项目的克隆

flutter - 在 Flutter PageView 中切换页面时丢失小部件状态

android - Flutter:在 Android Studio 中打开 android 模块被

ios - 如何在键盘外观上为 Flutter 布局设置动画

string - flutter/Dart : Convert HEX color string t

flutter - 保留选项卡 View 页面之间的状态