How can we change appbar background color in flutter

Issue

I am trying to set a common theme for app so I need to change appbar color as a color that indicates hex code #0f0a1a

const MaterialColor toolbarColor = const MaterialColor(
    0xFF151026, const <int, Color>{0: const Color(0xFF151026)});

I try this piece of code to make a custom color but fails.
How can I do this from themeData?

Solution

Declare your Color:

const primaryColor = Color(0xFF151026);

In the MaterialApp level (will change the AppBar Color in the whole app ) change primaryColor

return MaterialApp(
  title: 'Flutter Demo',
  theme: ThemeData(
   primaryColor: primaryColor,
   ),
  home: MyApp(),
);

and if you want to change it on the Widget level modify the backgroundColor

  appBar: AppBar(
    backgroundColor: primaryColor,
  ),

Answered By – Raouf Rahiche

Answer Checked By – Terry (FlutterFixes Volunteer)

Leave a Reply

Your email address will not be published. Required fields are marked *