CODEWITHSUNDEEP
flutter
Knomic
Knomic

Reputation: 35

Container in Bottom Navigation Bar taking whole screen

I want to put a container in the bottom navigation bar for my app but it's taking up the whole screen

bottomNavigationBar: Container(
      padding: EdgeInsets.only(
          left: Dimensions.sizeWidthPercent(16),
          right: Dimensions.sizeWidthPercent(16),
          bottom: Dimensions.sizeHeightPercent(30)),
      child: Column(
        children: const [
          TextContainer(text: 'Proceed to request dispatcher')
        ],
      ),
    )

This is what happens the whole scaffold body goes missing

This is what happens the whole scaffold body goes missing

Upvotes: 1

Views: 1907

Answers (2)

Shibil M
Shibil M

Reputation: 132

Just add height to the container, it will resolve the issue

Upvotes: 0

Dineth Prabashwara
Dineth Prabashwara

Reputation: 504

The issue was here.Column will expand vertically when no size was not declared to his parent vertically. So you need to declare main axis size for the column. Add following mainAxis Size to the column.

 mainAxisSize:MainAxisSize.min,

So the full code for above is,

bottomNavigationBar: Container(
      padding: EdgeInsets.only(
          left: Dimensions.sizeWidthPercent(16),
          right: Dimensions.sizeWidthPercent(16),
          bottom: Dimensions.sizeHeightPercent(30)),
      child: Column(
        mainAxisSize:MainAxisSize.min,
        children: const [
          TextContainer(text: 'Proceed to request dispatcher')
        ],
      ),
    )

Upvotes: 7

Related Questions