如何更改应用栏上文本和图标的颜色 flutter

Question

I am having problem while changing the color of text and icon widgets on appbar in flutter.

I have tried theme inside the material app but it's not working.

where this is working: title: Text('Profile', style: TextStyle(color: Colors.black)), But I want to apply this for all appbars. So where should I make changes in material theme.

MaterialApp(
          title: "My App",
          theme: ThemeData(
            appBarTheme: AppBarTheme(
              backgroundColor: Color(0xffFCD581),
              brightness: Brightness.dark,
            ),

how can i change the color of text: profile and icon . globally.

setting color of headline6 to Colors.black works. but it's also making the title text smaller. I can set the fontsize in headline6 and it reflects universally. But I think the default size of title that we get with appbar is suitable enough. So is there any solution that will only change the color of the appbar text, title without affecting the fontsize .

Answer 1

Use IconButton as the back button and assign color, for Title use TextStyle and assign a color.

1. Using AppBar:

Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.white,
        leading: IconButton(
          icon: Icon(Icons.arrow_back, color: Colors.red),
          onPressed: () => Navigator.of(context).pop(),
        ),
        title: Text("Sample", style: TextStyle(color: Colors.red),),
        centerTitle: true,
      ),

2. Using ThemeData:

theme: ThemeData(
    primaryTextTheme: TextTheme(
      headline6: TextStyle(color: Colors.red),
    ),
    appBarTheme: AppBarTheme(
      iconTheme: IconThemeData(color: Colors.red),
    ),
  ),

Output:

Answer 2

Use the iconTheme and titleTextStyle properties of your AppBarTheme in your MaterialApp widget.

Answer 3

Here is how to change the color of text and icons:

   return Scaffold(
      appBar: AppBar(
        leading: null,
        automaticallyImplyLeading: true,
        centerTitle: true,
        iconTheme: IconThemeData(color: myCustomIconColor), //ICONS
        titleTextStyle: GoogleFonts.lato(
           textStyle: TextStyle(
           fontSize: 23,
           fontWeight: FontWeight.w700,
           color: myCustomTextColor,    //TEXT
         ),
        ),
        title: Text('Settings'),
      ),

Or you can style the Text widget directly and change the color there