Home > Back-end >  Fluttter ThemeData
Fluttter ThemeData

Time:10-28

I want to set a ThemeData in my project but i can't set the correct background color i think that the problem it's about brightness....

theme: ThemeData(
        colorScheme: ColorScheme(
          primary: Color(0xFF0A0E21),
          onBackground: Colors.white,
          one rror: 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,
        ),
      ),

Brightness can't be null so how i can solve to have the right color in background? I read that background for ThemeData it's space between element if i scroll down. So how i can set in ThemeData correct background for my scaffold?

CodePudding user response:

You can set the scaffoldBackgroundColor of your themeData like so.

theme: ThemeData(
        colorScheme: ColorScheme(
          primary: Color(0xFF0A0E21),
          onBackground: Colors.white,
          one rror: 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,
      ),

CodePudding user response:

Instead of passing ThemeData, use Theme.of(context).copyWith(). Also, I would say use themeMode and darkTheme.

Rather than overriding everything, it often makes sense to extend the parent theme. You can handle this by using the copyWith() method.

 theme: Theme.of(context).copyWith(
        colorScheme: const ColorScheme(
          primary: Color(0xFF0A0E21),
          onBackground: Colors.white,
          one rror: 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,
        ),

for more themes

  • Related