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