Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to change text color of AppBar, icon color of FAB universally using theme?

Tags:

flutter

I am able to set the background color of AppBar to Colors.amber. This automatically sets the text color to Black. I am aware of the accessibility issues that may arise but anyways I want the text color to be White.

I am still able to set the text color from the AppBar but I would like to set it universally.

Here's the theme I'm using for my app.

title: 'Flutter Demo', theme: new ThemeData(   primarySwatch: Colors.amber,   textTheme: Theme.of(context).textTheme.apply(     bodyColor: Colors.white,     displayColor: Colors.white,   ), ), 
like image 460
ryanafrish7 Avatar asked May 31 '18 08:05

ryanafrish7


People also ask

How do I change text color in AppBar?

Go to the app > res > values > themes > themes.

How do you change the color of the AppBar icon in Flutter?

Steps. Step 1: Inside the AppBar , add the iconTheme parameter and assign the IconThemeData widget. Step 2: Inside the IconThemeData, add the color parameter and assign the color of your choice.

How do I change my AppBar color to white in Flutter?

Step 1: Locate the file where you have placed the AppBar widget. Step 2: Inside the AppBar widget, add the backgroundColor parameter and set the color of your choice.


Video Answer


2 Answers

I think the most straightforward way of doing this is to adjust the title color for the theme that you are working with:

theme: new ThemeData(   primarySwatch: Colors.grey,   primaryTextTheme: TextTheme(     headline6: TextStyle(       color: Colors.white     )   ) ) 
like image 64
Nader Dabit Avatar answered Oct 13 '22 10:10

Nader Dabit


I used a slightly different technique, I didn't use a theme, I just customized its appearance, so that when I created it looked like this:

appBar: new AppBar(   iconTheme: IconThemeData(     color: Colors.white   ),   title: const Text('Saved Suggestions', style: TextStyle(     color: Colors.white   )),   backgroundColor: Colors.pink, ), 
like image 34
Arthur Facredyn Avatar answered Oct 13 '22 12:10

Arthur Facredyn