This question is related to the following question. Tab navigation selection reverts to first one when text field is used in other tabs

I'm having the exact same issue that this person had.He answered his own question with a solution but I don't understand his answer. He asked his question back in 2018 and hasn't been online since 2019 (at the time of writing this) so I doubt he is going to answer me any time soon. I'm happy to add more detail if needed but an explanation of the other question's answer should be enough to solve my problem.

    class Tab_Controller extends StatefulWidget {
  Tab_Controller({Key? key, required this.currentIndex}) : super(key: key);
  int currentIndex;
  @override
  State<Tab_Controller> createState() => _Tab_ControllerState();
}

class _Tab_ControllerState extends State<Tab_Controller> {
  final screens = [
    BrowseTab(),
    RequestsTab(),
    PostTabDesign(),
    ChatRoom(),
    ProfileTab()
  ];
  @override
  Widget build(BuildContext context) => Scaffold(
      body: screens[widget.currentIndex],
      bottomNavigationBar: BottomNavigationBar(
        iconSize: 20,
        backgroundColor: kPrimaryColor_MatiesMaroon,
        showSelectedLabels: false,
        showUnselectedLabels: false,
        selectedItemColor: const Color.fromRGBO(
            183,
            153,
            98,
            1), 
        type: BottomNavigationBarType.fixed,
        currentIndex: widget.currentIndex,
        onTap: (index) => setState(() => widget.currentIndex = index),
        items: const [
          BottomNavigationBarItem(
              icon: Icon(Icons.shopping_cart),
              label: "Browse",
              backgroundColor: Colors.transparent),
          BottomNavigationBarItem(
              icon: Icon(Icons.question_mark),
              label: "Requests",
              backgroundColor: Colors.transparent),
          BottomNavigationBarItem(
              icon: Icon(Icons.add),
              label: "Post",
              backgroundColor: Colors.transparent),
          BottomNavigationBarItem(
              icon: Icon(Icons.chat_bubble_outline),
              label: "Chats",
              backgroundColor: Colors.transparent),
          BottomNavigationBarItem(
              icon: Icon(Icons.person),
              label: "Profile",
              backgroundColor: Colors.transparent)
        ],
      ));
}


class ProfileTab extends StatefulWidget {
  @override
  State<ProfileTab> createState() => _ProfileTabState();
}

class _ProfileTabState extends State<ProfileTab> {
  late var con;
  void initState() {
    super.initState();
    con = TextEditingController();
  }

  @override
  Widget build(BuildContext context) => Scaffold(
        body: SafeArea(
          child: Column(
            children: [
              TextField(
                controller: con,
              ),
              Text("Profile Tab"),
              ElevatedButton(
                  onPressed: () async {
                    await FirebaseAuth.instance.signOut();
                    runApp(MaterialApp(
                      home: StartScreen(),
                    ));
                  },
                  child: Text("Logout"))
            ],
          ),
        ),
      );
}

When the TextField is clicked it navigates to the BrowseTab

Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp();
  runApp(MaterialApp(
    home: StartScreen(),
  ));
}

class StartScreen extends StatelessWidget {
  bool isLoading = false;

  Widget build(BuildContext context) {
    Size size = MediaQuery.of(context).size;
    if (FirebaseAuth.instance.currentUser != null) {
      return Tab_Controller(currentIndex: 0);
    }
    return Material(...

Is it because the currentIndex parm is hardcoded to 0?That was just done so when the app opens it opens on the BrowseTab().

CodePudding user response：

The answer in Tab navigation selection reverts to first one when text field is used in other tabs says it clearly.

That issue was happening because he was initializing the controller inside the build method. so every time the widget rebuilds the index sets to its initial value.

To get rid of this issue, initialize the controller in the initState({}) method using stateful widget.

To set the index to 0 in first, you can simply define a index variable in tab_controller page rather than passing it from other page.

initialize the index to 0 in initState method in Tab_Controller. Remove the index as parameter.

class Tab_Controller extends StatefulWidget {
  Tab_Controller({Key? key}) : super(key: key);                <-- updated
  @override
  State<Tab_Controller> createState() => _Tab_ControllerState();
}

class _Tab_ControllerState extends State<Tab_Controller> {
  late int index;               <-- updated
  
  final screens = [
    BrowseTab(),
    RequestsTab(),
    PostTabDesign(),
    ChatRoom(),
    ProfileTab()
  ];
  
  @override
  void initState() {
    index = 0;               <--  updated
    super.initState();
  }
  @override
  Widget build(BuildContext context) => Scaffold(
      body: screens[index],               <--  updated
      bottomNavigationBar: BottomNavigationBar(
        iconSize: 20,
        backgroundColor: kPrimaryColor_MatiesMaroon,
        showSelectedLabels: false,
        showUnselectedLabels: false,
        selectedItemColor: const Color.fromRGBO(
            183,
            153,
            98,
            1), 
        type: BottomNavigationBarType.fixed,
        currentIndex: index,               <--  updated
        onTap: (i) => setState(() => index = i),             <--  updated
        items: const [
          BottomNavigationBarItem(
              icon: Icon(Icons.shopping_cart),
              label: "Browse",
              backgroundColor: Colors.transparent),
          BottomNavigationBarItem(
              icon: Icon(Icons.question_mark),
              label: "Requests",
              backgroundColor: Colors.transparent),
          BottomNavigationBarItem(
              icon: Icon(Icons.add),
              label: "Post",
              backgroundColor: Colors.transparent),
          BottomNavigationBarItem(
              icon: Icon(Icons.chat_bubble_outline),
              label: "Chats",
              backgroundColor: Colors.transparent),
          BottomNavigationBarItem(
              icon: Icon(Icons.person),
              label: "Profile",
              backgroundColor: Colors.transparent)
        ],
      ));
}