How to center the IconButton of Appbar in flutter

2,152

Here's a workaround you can do to achieve this since actions are usually after the title as the docs says AppBar class.

appBar: AppBar(
            automaticallyImplyLeading: false,
            centerTitle: true,
            title: Row(
              mainAxisSize: MainAxisSize.min,
              children: <Widget>[
                IconButton(
                  icon: Icon(Icons.home),
                  onPressed: null,
                ),
                IconButton(
                  icon: Icon(Icons.trending_up),
                  onPressed: null,
                ),
                IconButton(
                  icon: Icon(Icons.people_outline),
                  onPressed: null,
                ),
                IconButton(
                  icon: Icon(Icons.person_outline),
                  onPressed: null,
                ),
                IconButton(
                  icon: Icon(Icons.notifications_none),
                  onPressed: null,
                ),
                IconButton(icon: Icon(Icons.search), onPressed: null),
                IconButton(
                  icon: Icon(Icons.brightness_5),
                  onPressed: null,
                ),
              ],
            )),

But maybe you should consider using TabBar in your case instead.

Share:
2,152
Rohit Nishad
Author by

Rohit Nishad

I am Indian based Hacker and Developer.

Updated on December 16, 2022

Comments

  • Rohit Nishad
    Rohit Nishad over 1 year

    I working with a flutter application and see a problem in the App bar. The icon button is not at the center of the App bar.

    This is my code.

    appBar: AppBar(
        automaticallyImplyLeading: false,
        actions: <Widget>[
          IconButton(
              icon: Icon(Icons.home),
              onPressed: null,
          )
        ],
      ),
    

    The IconButton is not in center of appbar or navbar.

  • Vettiyanakan
    Vettiyanakan over 4 years
    you wont need centerTitle: true,
  • Crazy Lazy Cat
    Crazy Lazy Cat over 4 years
    @AbyMathew No. you have to set it true, so that you get it center in both Android & IOS. By default in Android, its left aligned & in IOS its centered.