Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Extend Container behind bottom navigation flutter

I am trying to extend the white container behind the bottom navigation bar to the very end of the screen. Not just to the limit of the botton navigation bar (as you can see in the picture).

Any help or idea is really appreciated, I am quite new in Flutter. Thanks!

The structure of the app is:

bottomNavigationBar: BottomAppBar(
    shape: CircularNotchedRectangle(),
    notchMargin: 8.0,
    child: Row(
      mainAxisSize: MainAxisSize.max,
      mainAxisAlignment: MainAxisAlignment.spaceEvenly,
      children: <Widget>[
        IconButton(
          icon: Icon(
            Icons.show_chart,
          ),
          onPressed: () {},
        ),
        SizedBox(width: 48.0),
        IconButton(
          icon: Icon(
            Icons.filter_list,
          ),
          onPressed: () {},
        ),
      ],
    ),
  ),
  floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
  floatingActionButton: FloatingActionButton(
    child: Icon(Icons.add),
    onPressed: () {},
  ),
  body: Column(
    children: <Widget>[
      Expanded(
        child: Container(
        height: 100,
        decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.only(
            topLeft: Radius.circular(40),
            topRight: Radius.circular(40)
          )
        ),
      ),
      )
    ],
  )
like image 361
Helguera Avatar asked Jul 19 '26 21:07

Helguera


1 Answers

you can use "extendBody: true" inside "Scaffold" class

Scaffold(
    extendBody: true,
    body: _yourBody(),
    bottomNavigationBar: _yourBottomNavBar(),
)
like image 89
alireza easazade Avatar answered Jul 21 '26 10:07

alireza easazade



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!