How To Easily Change Flutter Appbar Icon Color Theme

flutter appbar icon color theme

In this Flutter post, we will se changing the Flutter appbar icon color theme with step by step explanation. We will be customizing the Flutter appbar icon color theme by using a practical Flutter example code. I hope after reading this post, you will be able to easily customize the color theme of Flutter appbar widget.

What is Flutter Appbar Icon Color Theme?

As the name suggests, it is used to set the color of Flutter appbar icon widgets. We will first see what the default Flutter appbar icon color theme is and then we will change it using a proper Flutter example.

Default Flutter Appbar Icon Color Theme

In order to see the default Flutter appbar color theme of icons, we have to define a simple Flutter appbar with a leading icon and some action icons. See the below code:

AppBar(
      leading: IconButton(onPressed: () {}, icon: Icon(Icons.arrow_back_ios)),
      actions: [
            IconButton(onPressed: () {}, icon: Icon(Icons.logout))
               ],
    )
flutter appbar default icon theme color
You can see that we haven’t specified white color to the icon but still it is white. This is the default Flutter appbar color theme of icons.

Change Flutter Appbar Icon Color Theme

To change the default Flutter appbar color theme of icons, we have to use the icon theme constructor of the Flutter appbar widget. This constructor takes an icon theme data. Now by passing that IconThemeData   to it and using the color constructor of IconThemeData,  can easily change the Flutter appbar color theme of icons. This constructor takes a color, so we will pass black color to it. See below code:

iconTheme: IconThemeData(color: Colors.black)
flutter appbar icon theme color
You can see that the Flutter appbar color theme of icons are successfully customized.
You can now easily change the Flutter appbar icon theme color. Feel free to ask questions related to Flutter appbar color theme. I would be glad to answer all questions.

Flutter Appbar Icon Color Theme Customization Source Code

flutter appbar icon theme color

import 'package:flutter/material.dart';
void main() {
  runApp(const MyApp());
}
class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Homepage(),
    );
  }
}
class Homepage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return SafeArea(
        child: Scaffold(
            appBar: AppBar(
      iconTheme: IconThemeData(color: Colors.black),
      leading: IconButton(onPressed: () {}, icon: Icon(Icons.arrow_back_ios)),
      actions: [IconButton(onPressed: () {}, icon: Icon(Icons.logout))],
    )));
  }
}

Conclusion

To conclude, hope you now will easily change Flutter appbar icon color theme. I would love to have your feedback on this post. Thank you for reading.

Leave a Comment

Your email address will not be published.