How can I make my nav bar go through my System Nav bar-CodePudding

This is my nav bar theme data

 navigationBarTheme: NavigationBarThemeData(
        backgroundColor: Color(0xff0100f5b),
        indicatorColor: Color(0xff5454c2),
        labelTextStyle: MaterialStateProperty.all(const TextStyle(
          color: Colors.white,
          fontSize: 14,
          fontWeight: FontWeight.bold,
        )),
        iconTheme: MaterialStateProperty.all(const IconThemeData(
          color: Color(0xffffffff),
          size: 25,
        )),
      ),

This is my SystemChrome code

SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
    statusBarColor: Colors.transparent,
    systemStatusBarContrastEnforced: true,
    statusBarBrightness: Brightness.light,
    systemNavigationBarContrastEnforced: true,
    systemNavigationBarColor: Colors.transparent,
  ));

And this is how it looks.

I can't understand why can't it go down like the app bar goes up through the status bar.

Thanks in advance.

CodePudding user response：

Just wrap the BottomNavigationBar with this

return SafeArea(
  bottom: true,
  child: BottomNavigationBar(...),
)

CodePudding user response：

Did you forget to put in Scaffold?