Question

我想在ThemeData中使用自定义颜色和主题。我知道我可以在一个单独的文件中定义它们，然后导入该文件并使用它们。但是我希望这些颜色在更改深色和浅色主题时起作用。目前，我有分别切换的深色和浅色主题。无论如何，有没有在深色和浅色ThemeData中分别定义自定义颜色？

AppTheme.dart：

public byte[] getBody(){...}

App.dart

class AppTheme {
  AppTheme._();

  // Light Theme
  static final ThemeData lightTheme = ThemeData.light().copyWith(
    appBarTheme: AppBarTheme(
      color: Colors.grey[100],
      brightness: Brightness.light,
    ),
    scaffoldBackgroundColor: Colors.white,

    actionButtonColor: Colors.black, // Like this
  );

  // Dark Theme
  static final ThemeData darkTheme = ThemeData.dark().copyWith(
    appBarTheme: AppBarTheme(
      color: Colors.grey[850],
      brightness: Brightness.dark,
    ),
    scaffoldBackgroundColor: Colors.grey[900],

    actionButtonColor: Colors.red, // Like this
  );
}

Answer 1

我认为您已经有了自己的问题的答案，您在代码示例中所做的事情是正确的，并且是合法的。 “合法”一词是指代码可以正常工作并产生您期望的结果，当然，除了部分actionButtonColor属性之外，因为该属性不属于ThemeData api的一部分。 / p>

或者，如果您询问如何在主题数据中使用该自定义actionButtonColor属性，则不能。因为它是用于材质主题的预定义小部件。 actionButton应该只使用主题中的现有属性。但是，如果您确实需要这样做，则可以在dart 2.7中使用实验性扩展方法，例如

extension MyColorScheme on ColorScheme {
  Color get actionButtonColor => const Colors.red;
}

ActionButtonComponent(
    color: Theme.of(context).colorScheme.actionButtonColor, 
);

但是，与扩展方法一起使用时，您将无法为其他ThemeData使用不同的颜色方案，例如深色和浅色主题。您可能需要研究this issue。

我希望它会有所帮助。

Answer 2

您可以研究ThemeData的扩展，我发现它非常有用和简单。

    extension LightThemeEx on ThemeData{
      Color get appSubTitleColor{
        return Color(0xFF5F6368);
      }
    }

您可以在其上创建自定义颜色；您的小部件上的实现将非常相似：

      Theme.of(context).appSubTitleColor

希望有帮助！

Flutter-在ThemeData中使用自定义颜色和主题

2 个答案: