How to change the `primary color` for ThemeData dark in flutter?

user_11795918 0
Viewed 1665

I am using flutter 2.8.0 to create a simple app. But when I am trying to change the primary color for the App it does not work with me.

This is the code I am working on:

class BMICalculator extends StatelessWidget {
  const BMICalculator({Key? key}) : super(key: key);

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.dark().copyWith(
        primaryColor: const Color(0xFF0A0E21),
        scaffoldBackgroundColor: const Color(0xFF0A0E21),
      ),
      home: const InputPage(),
    );
  }
}
flutter
3 Answers

@Mrinal already mentioned you to use primarySwatch. Flutter team intended to build clean up the Theme system and make everything more consistent and based off of the ColorScheme colors. They recommend using color scheme instead of primary color

 theme: ThemeData(
     primaryColor: ColorsX.primary,
     colorScheme: ColorScheme.light().copyWith(primary: ColorsX.primary),
  );

For dark theme

theme: ThemeData.dark().copyWith(
        colorScheme: ColorScheme.light().copyWith(primary: Colors.tealAccent),
        ),

output:

enter image description here

For more read this article article

user_150492640

Use primarySwatch

theme: ThemeData(
primarySwatch: Colors.red,
),
user_59967460

I found a solution for me..

MaterialColor _primartSwatch = Colors.purple;

 @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'MyApp',
      themeMode: _themeMode,
      theme: ThemeData(
        primarySwatch: _primartSwatch,
      ),
      darkTheme: ThemeData(
        brightness: Brightness.dark,
        primarySwatch: _primartSwatch,
      ),
      home: SplashScreen(),
    );
  }
user_84510320
Related