Rohan Choudhary
Rohan Choudhary

Reputation: 303

Set State not working in bottom navigation bar item even after using setState for 4 elements

When I use 4 items in bottom navigation bar, only menu is shown as selected item (index 0) even though _currentIndex is changing as usual. What to do now, is it because of constructor of used in category screen?

 @override
  Widget build(BuildContext context) {
    User user = FirebaseAuth.instance.currentUser;

    int _currentIndex = 0;

    void onTabTapped(int index) {
      setState(() {
        _currentIndex = index;
      });
    }


    final List<Widget> _children = [
      CategoryScreen(email: user.email),
      TabBarOrder(),
      PayInScreen(),
      ProfileScreen(),
    ];

    return Scaffold(
      body: _children[_currentIndex],
      bottomNavigationBar: BottomNavigationBar(
        showSelectedLabels: true,
        onTap: onTabTapped,
        currentIndex: _currentIndex,
        type: BottomNavigationBarType.fixed,
        iconSize: 0,
        items: [
          BottomNavigationBarItem(icon: Icon(Icons.home), label: 'Menu'),
          BottomNavigationBarItem(icon: Icon(Icons.mail), label: 'Order'),
          BottomNavigationBarItem(
              icon: Icon(Icons.play_circle_filled), label: 'Pay-in'),
          BottomNavigationBarItem(
              icon: Icon(Icons.play_circle_filled), label: 'Profile'),
        ],
      ),
    );
 }

Please help

Upvotes: 0

Views: 1188

Answers (1)

Zero Live
Zero Live

Reputation: 1843

int _currentIndex = 0;

    void onTabTapped(int index) {
      setState(() {
        _currentIndex = index;
      });
    }

@override
  Widget build(BuildContext context) {
    User user = FirebaseAuth.instance.currentUser;

    

    final List<Widget> _children = [
      CategoryScreen(email: user.email),
      TabBarOrder(),
      PayInScreen(),
      ProfileScreen(),
    ];

    return Scaffold(
      body: _children.elementAt(_currentIndex),
      bottomNavigationBar: BottomNavigationBar(
        showSelectedLabels: true,
        onTap: onTabTapped,
        currentIndex: _currentIndex,
        type: BottomNavigationBarType.fixed,
        iconSize: 0,
        items: [
          BottomNavigationBarItem(icon: Icon(Icons.home), label: 'Menu'),
          BottomNavigationBarItem(icon: Icon(Icons.mail), label: 'Order'),
          BottomNavigationBarItem(
              icon: Icon(Icons.play_circle_filled), label: 'Pay-in'),
          BottomNavigationBarItem(
              icon: Icon(Icons.play_circle_filled), label: 'Profile'),
        ],
      ),
    );
 }

Upvotes: 1

Related Questions