Can't set different colors for text in AppBar and text in Scaffold using ThemeData

Question

In my MaterialApp widget, I'm using the theme property to set the universal theme for my app. I want to set a blue color for the text in the AppBar, and red color for text in the Scaffold body. But using textTheme in ThemeData, only the Scaffold's text has the intended color, not the AppBar text.

This is the code for the theme I'm using in MaterialApp:

theme: ThemeData(
  primaryColor: Color(0xFF0A0E21), //a navy bluish color
  scaffoldBackgroundColor: Color(0xFF0A0E21),
  accentColor: Colors.purple,
  textTheme: TextTheme(
    headline6: TextStyle(
      color: Colors.blue
    ),
    bodyText2: TextStyle(
      color: Colors.red
    )
)

The AppBar text remains white, but text in the body of the app (in the Scaffold I'm using) changes to red. I'm not setting different colors anywhere else.

dhanasekar dhanasekar · Accepted Answer · 2020-07-29T05:43:14

you have to use appBarTheme on themeData

ThemeData(
    scaffoldBackgroundColor: Color(0xFF0A0E21),,
    appBarTheme: AppBarTheme(
      color: Colors.blue,
),

Can't set different colors for text in AppBar and text in Scaffold using ThemeData

1 Answers