So the right way to change appbar back button color in Flutter is to use iconTheme to change the colors of all the icons present in the appbar.
Step 2: Inside the AppBar widget, find the Text widget inside the title parameter. Step 3: Inside the Text widget, add the style parameter and add the TextStyle widget. Step 4: Inside the TextStyle widget, add the color parameter and assign the appropriate color. Step 5: Run the app.
You have to use the iconTheme
property from the AppBar , like this:
appBar: AppBar(
iconTheme: IconThemeData(
color: Colors.black, //change your color here
),
title: Text("Sample"),
centerTitle: true,
),
Or if you want to handle the back button by yourself.
appBar: AppBar(
leading: IconButton(
icon: Icon(Icons.arrow_back, color: Colors.black),
onPressed: () => Navigator.of(context).pop(),
),
title: Text("Sample"),
centerTitle: true,
),
Even better, only if you want to change the color of the back button.
appBar: AppBar(
leading: BackButton(
color: Colors.black
),
title: Text("Sample"),
centerTitle: true,
),
you can also override the default back arrow with a widget of your choice, via 'leading':
leading: new IconButton(
icon: new Icon(Icons.arrow_back, color: Colors.orange),
onPressed: () => Navigator.of(context).pop(),
),
all the AppBar widget does is provide a default 'leading' widget if it's not set.
It seemed to be easier to just create a new button and add color to it, heres how i did it for anyone wondering
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
leading: BackButton(
color: Colors.black
),
You can also set leading icon color globally for the app
MaterialApp(
theme: ThemeData(
appBarTheme: AppBarTheme(
iconTheme: IconThemeData(
color: Colors.green
)
)
)
)
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With