Flutter, Android and IOS bottom navigation bar size is different

Viewed 1384

An overflow error occurred due to the bottom navigation bar height in ios, the layout that worked well on all Android devices.

It seemed to be because of the extra space because of the format of turning off the app by pulling it up from the bottom, which is governed by the IOS operating system.

it is super annoying I forcibly increased the bottom navigation bar height because of IOS, but the design is now bad in Android. Anyone know how to solve it?

--UPDATE

Scaffold(
            bottomNavigationBar: Container(
              height: 50,
              child: BottomNavigationBar(
                ...
              ),
            ),
          )
2 Answers

You can easily make height different for both platforms:

height:  Platform.isIOS ? 50:40

So here if the Platform is IOS the height will be 50 or it will be 40.

Hey i tried custom painter and i realized that for iphone 13 the height is 90 pixel for bottom navigation bar and for android the height is different which is the value of kBottomNavigationBarHeight. So i declared this value in my constant file such as double btmNavigationBarHeight = Platform.isAndroid ? kBottomNavigationBarHeight : 90;. Hope it helps anyone with the same problem

Related