Flutter: How can I keep to my selected navigator when I'll go to a new screen and go back

0

I'm having a problem right now in my bottom navigation in flutter.

I have four navigation "Community, Feeds, Activity, Profile".

In my "Feeds" navigation I have a button named "View Profile" everytime I click that button it directs me to a new screen using

"Navigator.push(context, MaterialPageRoute())"

and I notice it auto generates a "<-" or "back arrow" icon on the appbar.

The problem is everytime I click that "back arrow", it redirects me to the first option on my navigation bar.

Not on the "Feeds" navigation.

Any tips how to fix this?

Here is my bottom navigation code:

_getPage(int page) {
switch (page) {
case 0:
  return NewsFeed();
case 1:
  return OrgAndNews();
case 2:
  return MyActivity();
case 3:
  return Profile();
 }
}

int currentPage = 0;

void _onBottomNavBarTab(int index) {
  setState(() {
    currentPage = index;
  });

}


 return Scaffold(
  body: Container(
    child: _getPage(currentPage),
  ),
  bottomNavigationBar: Container(
    height: _height * .09,
    child: BottomNavigationBar(
      backgroundColor: Color(0xFFFFFFFF),
      fixedColor: Color(0xFF121A21),
      unselectedItemColor: Color(0xFF121A21),
      currentIndex: currentPage,
      onTap: _onBottomNavBarTab,
      items: [
        BottomNavigationBarItem(
          icon: Icon(FontAwesomeIcons.users),
          title: Padding(
            padding: const EdgeInsets.only(top: 3.0),
            child: Text('Community', style: TextStyle(fontSize: ScreenUtil.getInstance().setSp(35),
              fontWeight: FontWeight.w800),
            ),
          ),
        ),
        BottomNavigationBarItem(
          icon: Icon(FontAwesomeIcons.newspaper),
          title: Padding(
            padding: const EdgeInsets.only(top: 3.0),
            child: Center(
              child: Text('Feeds', style: TextStyle(fontSize: ScreenUtil.getInstance().setSp(35),
                  fontWeight: FontWeight.w800),),
            ),
          ),
        ),
        BottomNavigationBarItem(
          icon: Icon(FontAwesomeIcons.listUl),
          title: Padding(
            padding: const EdgeInsets.only(top: 3.0),
            child: Text('My Activity', style: TextStyle(fontSize: ScreenUtil.getInstance().setSp(35),
                fontWeight: FontWeight.w800),),
          ),
        ),
        BottomNavigationBarItem(
          icon: Icon(FontAwesomeIcons.userAlt),
          title: Padding(
            padding: const EdgeInsets.only(top: 3.0),
            child: Text('Profile', style: TextStyle(fontSize: ScreenUtil.getInstance().setSp(35),
                fontWeight: FontWeight.w800),),
          ),
        ),
      ],
    ),
  ),
);

My code for the page when you click the "View Profile":

  class OrgProfile extends StatefulWidget {
 OrgProfile(this.orgName) : super();

final String orgName;
  @override
  _OrgProfileState createState() => _OrgProfileState();
 }

 class _OrgProfileState extends State<OrgProfile> {
 @override
 final db = Firestore.instance;

  Container buildItem(DocumentSnapshot doc) {
return Container(
  child: Column(
    children: <Widget>[
      Center(
        child: Padding(
          padding: const EdgeInsets.only(top: 20.0),
          child: CircleAvatar(
            radius: 70,
          ),
        ),
      ),
      Text(
        '${doc.data['Email']}',
        style: TextStyle(color: Colors.black),
      )
    ],
  ),
 );
 }

 Widget build(BuildContext context) {
return Scaffold(
  appBar: AppBar(
    title: Text(widget.orgName),
  ),
  body: StreamBuilder<QuerySnapshot>(
      stream: db
          .collection('USERS')
          .where('Name of Organization', isEqualTo: widget.orgName)
          .snapshots(),
      builder: (context, snapshot) {
        if (snapshot.hasData) {
          return Column(
              children: snapshot.data.documents
                  .map((doc) => buildItem(doc))
                  .toList());
        } else {
          return SizedBox();
        }
      }),
   );
  }
 }

My code when i click the "View Profile" button:

   onPressed: () {
      Navigator.push(
        context,
           MaterialPageRoute(
           builder: (BuildContext context) => new 
      OrgProfile(
         doc.data['Name of Organization'])));
     },

My feeds UI:

enter image description here

My View Profile UI:

enter image description here

flutter
dart
flutter-layout
asked on Stack Overflow Nov 14, 2019 by Lix • edited Nov 14, 2019 by Lix

2 Answers

0

Have you used MaterialPage Route With Builder Like This?

Navigator.push(
                context,
                MaterialPageRoute(
                builder: (BuildContext context) => new MyToDoThunder(),
                    ),
                  )

Homepage Code :-

class HomePage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    // 
    return new HomePageState();
  }
}

class HomePageState extends State<HomePage> {
  var db = DatabaseHelper();
  int _selectedIndex = 0;
  List<bool> textColorChange = [true, false, false, false];
  final _widgetOptions = [
    StatusPageRedux(),
    RequestPage(),
    NotificationPage(),
    DashboardPage(),
  ];

  _bottomNavigationView() {
    return new Theme(
      isMaterialAppTheme: true,
      data: Theme.of(context)
          .copyWith(canvasColor: Theme.of(context).primaryColor),
      child: new BottomNavigationBar(
        type: BottomNavigationBarType.fixed,
        onTap: _onItemTapped,
        currentIndex: _selectedIndex,
        fixedColor: Colors.white,
        items: [
          new BottomNavigationBarItem(
            activeIcon: ThunderSvgIcons(
                path: 'assets/icons/Status.svg', height: 20.0, color: Colors.white),
            icon: ThunderSvgIcons(
                path: 'assets/icons/Status.svg', height: 20.0, color: Colors.white30),
            title: new Text(
              'Status',
              style: TextStyle(
                  color: textColorChange[0] ? Colors.white : Colors.white30),
            ),
          ),
          new BottomNavigationBarItem(
            title: new Text(
              'Requests',
              style: TextStyle(
                  color: textColorChange[1] ? Colors.white : Colors.white30),
            ),
            activeIcon: ThunderSvgIcons(
                path: 'assets/icons/Requests.svg', height: 20.0, color: Colors.white),
            icon: ThunderSvgIcons(
                path: 'assets/icons/Requests.svg',
                height: 20.0,
                color: Colors.white30),
          ),
          new BottomNavigationBarItem(
            activeIcon: ThunderSvgIcons(
                path: 'assets/icons/Notifications.svg',
                height: 20.0,
                color: Colors.white),
            icon: ThunderSvgIcons(
                path: 'assets/icons/Notifications.svg',
                height: 20.0,
                color: Colors.white30),
            title: new Text(
              'Notifications',
              style: TextStyle(
                  color: textColorChange[2] ? Colors.white : Colors.white30),
            ),
          ),
          new BottomNavigationBarItem(
            activeIcon: ThunderSvgIcons(
                path: 'assets/icons/dashboard.svg',
                height: 20.0,
                color: Colors.white),
            icon: ThunderSvgIcons(
                path: 'assets/icons/dashboard.svg',
                height: 20.0,
                color: Colors.white30),
            title: new Text(
              'Dashboard',
              style: TextStyle(
                  color: textColorChange[3] ? Colors.white : Colors.white30),
            ),
          ),
        ],
      ),
    );
  }

  @override
  Widget build(BuildContext context) {

    return new Scaffold(
      body: new Center(child: _widgetOptions.elementAt(_selectedIndex)),
      bottomNavigationBar: _bottomNavigationView(),
    );
  }

  void _onItemTapped(int index) {
    setState(() {
      _selectedIndex = index;
      for (int i = 0; i < textColorChange.length; i++) {
        if (index == i) {
          textColorChange[i] = true;
        } else {
          textColorChange[i] = false;
        }
      }
    });
  }
}
answered on Stack Overflow Nov 14, 2019 by Zeeshan Ansari • edited Nov 14, 2019 by Zeeshan Ansari
0

You will have to add your way back to the stack. Try the below appbar in you 'tuloung duloung' title page, it should do the trick. Note if your homescreen has tabs its advised to pass the index of the page you want to reach on exiting 'tuloung duloung'. Let me know if it helps.

AppBar(
    backgroundColor: Colors.transparent,
    centerTitle: false,
    brightness: Brightness.dark,
    title: Container(
      width: 150,
      child: Row(
       children:[
          IconButton(icon:Icons.back_arrow, 
          onpressed:() =>
           Navigator.pushReplacementNamed(context, '/Your Home_Screen');
          ),
          Text('tuloung duloung',
          style: TextStyle(
            fontWeight: FontWeight.w400,
            color: theme.primaryColor,
          )),
       ]
     ),
    ),
    automaticallyImplyLeading: false,
    iconTheme: IconThemeData(
      color: theme.primaryColor,
    ),
    actions:[ Container(
              width: 150,
              child: FlatButton.icon(
                  label: Text('Done'),
                  icon: Icon(Icons.check_circle),
                  onPressed: () => {
                    setState(() {
                     takingsnap = true;
                      _captureImage();
                    })
                  }),
            ),
          ]
        
  ),
answered on Stack Overflow Aug 11, 2020 by Lohit Rachakonda

User contributions licensed under CC BY-SA 3.0