The bottom navigation bar is static when it is moved to New Screen Flutter

Hello everyboy I am new with flutter and dart. I have been trying to implement a navigationBar on three different pages in my app. The toggling works well for an individual page but I have problems persisting the active and inactive tabs state on all the pages. It seems like when it navigates to another page, I lose the active state too the tabs.
Maybe there are better solutions than this.
I would be very grateful.
Thanks a lot

import 'package:FlutterWeb/sc_styles/sc_style_colors/sc_colors.dart';
import 'package:flutter/material.dart';
class ScBottomNavigationMenu extends StatefulWidget {
  @override
  _ScBottomNavigationMenuState createState() => _ScBottomNavigationMenuState();
}
class _ScBottomNavigationMenuState extends State<ScBottomNavigationMenu> {
  int _currentIndex = 0;
  @override
  Widget build(BuildContext context) => MediaQuery.of(context).size.width <= 800
      ? Container(
          child: BottomNavigationBar(
            selectedFontSize: 15,
            unselectedFontSize: 15,
            backgroundColor: ScColors.bottomNaviColor,
            currentIndex: _currentIndex,
            fixedColor: ScColors.bottomClkickColor,
            type: BottomNavigationBarType.fixed,
            items: [
              BottomNavigationBarItem(
                icon: _currentIndex == 0 ? Icon(Icons.home): Icon(Icons.home),
                title: Text('Home'),
              ),
              BottomNavigationBarItem(
                icon: _currentIndex ==  1 ? Icon(Icons.search) : Icon(Icons.search),
                title: Text('Search'),
              ),
              BottomNavigationBarItem(
                icon: _currentIndex == 2 ? Icon(Icons.settings) : Icon(Icons.settings),
                title: new Text('settings'),
              ),
            ],
            onTap: (int index) {
              setState(
                () {
                  _currentIndex = index;
                },
              );
              switch (index) {
                case 0:
                  Navigator.of(context).pushNamed('/');
                  break;
                case 1:
                  Navigator.of(context).pushNamed('/search');
                  break;
                case 2:
                  Navigator.of(context).pushNamed('/settings');
                  break;
              }
            },
          ),
        )
      : SizedBox();
}

Can you elaborate more? Maybe show us screen shot?

@Marshall-C Lets see first what happening in your scenario,
every time you switch a tab, build is called and all variable are reinitialise every time,
so here we have to store all those value on parent widget of all tabs and pass function to make changes on those values, or other way is to store those variable as a global static , and use them . This way you will not lose data while switching tabs.

1 Like

Thanks for the help, I fixed it

Thanks for the help, I fixed it