0

我想在我的项目中设置一个 ThemeData，但我无法设置正确的背景颜色。我认为问题在于亮度....

theme: ThemeData(
        colorScheme: ColorScheme(
          primary: Color(0xFF0A0E21),
          onBackground: Colors.white,
          onError: Colors.yellow,
          onSecondary: Colors.white,
          onSurface: Colors.white,
          background: Colors.yellow,
          secondary: Colors.purple,
          surface: Color(0xFF0A0E21),
          secondaryVariant: Colors.white,
          error: Colors.red,
          primaryVariant: Color(0xFF0A0E21),
          onPrimary: Color(0xFF0A0E21),
          brightness: Brightness.dark,
        ),
      ),

亮度不能为空，那么我该如何解决在背景中使用正确的颜色？当我向下滚动时，我读到 ThemeData 的背景在元素之间有一个空格。那么如何为我的脚手架正确设置 ThemeData 背景呢？

4

3 回答 3

1

你可以设置scaffoldBackgroundColor你themeData喜欢的。

theme: ThemeData(
        colorScheme: ColorScheme(
          primary: Color(0xFF0A0E21),
          onBackground: Colors.white,
          onError: Colors.yellow,
          onSecondary: Colors.white,
          onSurface: Colors.white,
          background: Colors.yellow,
          secondary: Colors.purple,
          surface: Color(0xFF0A0E21),
          secondaryVariant: Colors.white,
          error: Colors.red,
          primaryVariant: Color(0xFF0A0E21),
          onPrimary: Color(0xFF0A0E21),
          brightness: Brightness.dark,
        ),
        scaffoldBackgroundColor: Colors.yellow,
      ),
于 2021-10-27T13:39:06.917 回答
0

而不是传递ThemeData，使用Theme.of(context).copyWith(). 另外，我会说使用themeModeand darkTheme。

与其覆盖所有内容，不如扩展父主题通常是有意义的。您可以使用 copyWith() 方法来处理这个问题。

 theme: Theme.of(context).copyWith(
        colorScheme: const ColorScheme(
          primary: Color(0xFF0A0E21),
          onBackground: Colors.white,
          onError: Colors.yellow,
          onSecondary: Colors.white,
          onSurface: Colors.white,
          background: Colors.yellow,
          secondary: Colors.purple,
          surface: Color(0xFF0A0E21),
          secondaryVariant: Colors.white,
          error: Colors.red,
          primaryVariant: Color(0xFF0A0E21),
          onPrimary: Color(0xFF0A0E21),
          brightness: Brightness.dark,
        ),

更多主题

于 2021-10-27T13:51:20.650 回答
0

您需要使用如下代码

return MaterialApp(
  theme: ThemeData(
    colorScheme: const ColorScheme.dark(
      primary: Color(0xffbb86fc),
      primaryVariant: Color(0xff3700B3),
      secondary: Color(0xffcf6679),
      secondaryVariant: Color(0xff03dac6),
      surface: Color(0xffcf6679),
      background: Color(0xff121212),
      error: Color(0xffcf6679),
      onPrimary: Colors.black,
      onSecondary: Colors.black,
      onSurface: Colors.white,
      onBackground: Colors.white,
      onError: Colors.black,
      brightness: Brightness.dark,
    ),
  ),
  home: const YourPage(), 
);

在这种情况下，不需要任何属性，因此可以根据需要更改颜色。

于 2021-10-29T03:52:08.857 回答