'A RenderFlex overflowed on the right in appbar

I have this error in the appbar :A RenderFlex overflowed by 122 pixels on the right. how can fix it? this is my code

appBar: AppBar(
      leading: Row(
        mainAxisSize: MainAxisSize.max,
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          IconButton(
            onPressed: () {},
            icon: Icon(Icons.account_circle),
          ),
          SizedBox(
            width: 7,
          ),
          IconButton(
            onPressed: () {},
            icon: Icon(Icons.notifications),
          ),
          SizedBox(
            width: 7,
          ),
          Text('Dashboard')
        ],
      ),
      backgroundColor: Colors.brown[300],
    ),


Solution 1:[1]

Try below code hope its help to you. refer AppBar

appBar: AppBar(
      leading: Row(
        mainAxisSize: MainAxisSize.max,
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          Expanded(
            child: IconButton(
              onPressed: () {},
              icon: Icon(Icons.account_circle),
            ),
          ),
          SizedBox(
            width: 7,
          ),
          Expanded(
            child: IconButton(
              onPressed: () {},
              icon: Icon(Icons.notifications),
            ),
          ),
        ],
      ),
      title: Text('Dashboard'),
      backgroundColor: Colors.brown[300],
    ),

Result Screen-> image

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Ravindra S. Patil