ayham95 / Custom-navigator

A flutter package that handles navigation deep in the widget tree
MIT License
80 stars 33 forks source link

Issue regarding popping pages #19

Closed JenishHirpara closed 4 years ago

JenishHirpara commented 4 years ago

Thanks for this package, however i face an issue here, i have an app with a signup screen after which the screen with custom Scaffold appears(with the bottom Navbar), in there in my bottom Navbar i have four items, if i am currently in the first screen i.e., the HomePage(corresponding to the first item in Navbar) and i navigate to some other screen on pressing a button(say) which is in the HomePage , the bottom Navbar works perfectly and it remains in the navigated screen, but if i use my androids back button it will go directly to the signup page and not to the HomePage as it should, however if i use the backbutton in the appbar it will go to Homepage as intended, i dont know if everyone is facing this issue or i am the only one??

davidmednikov commented 4 years ago

I think this might be an issue that results from the navigator living underneath the scaffold layer. You might just have to stick with using the back button in the app bar. Using the stock back button kind of breaks the tab-based navigation with routes because of how Scaffold handles routes.

JenishHirpara commented 4 years ago

ok thanks!

IMEF-FEMI commented 4 years ago

ok here's how i solved the same issue using this CustomNavigator and WillPopScope. you can check out this medium article ------> by Andrea Bizzotto https://medium.com/coding-with-flutter/flutter-case-study-multiple-navigators-with-bottomnavigationbar-90eb6caa6dbf

bonus: using this method also preserves the page state--- meaning when you navigate to page 1 and you open page1 detail page, then you go to say page 2... it ensures the detail page of page 1 remain as you left it (The detail page still opened)

class MyHomePage extends StatefulWidget {
  final String title;

  const MyHomePage({Key key, this.title}) : super(key: key);
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _currentIndex = 0;

  @override
  Widget build(BuildContext context) {
    return WillPopScope(
      onWillPop: () async {
        final isFirstRouteInCurrentTab =
            !await navigatorKeys[_currentIndex].currentState.maybePop();
        if (isFirstRouteInCurrentTab) {
          // if not on the 'main' tab
          if (_currentIndex != 0) {
            // select 'main' tab
            setState(() {
              _currentIndex = 0;
            });
            // back button handled by app
            return false;
          }
        }
        // let system handle back button if we're on the first route
        return isFirstRouteInCurrentTab;
      },
      child: Scaffold(
          bottomNavigationBar: BottomNavigationBar(
            items: _items,
            onTap: (index) {
              setState(() {
                _currentIndex = index;
              });
              print(index);
            },
            currentIndex: _currentIndex,
          ),
          body: Stack(
            children: <Widget>[
              _buildPageOffstage(navigatorKeys[0], 0),
              _buildPageOffstage(navigatorKeys[1], 1),
              _buildPageOffstage(navigatorKeys[2], 2),
            ],
          )),
    );
  }

  Widget _buildPageOffstage(GlobalKey<NavigatorState> key, int index) {
    return Offstage(
      offstage: _currentIndex != index,
      child: CustomNavigator(
        navigatorKey: key,
        home: Page(title: 'Page $index'),
        pageRoute: PageRoutes.materialPageRoute,
      ),
    );
  }

  final navigatorKeys = [
    GlobalKey<NavigatorState>(),
    GlobalKey<NavigatorState>(),
    GlobalKey<NavigatorState>(),
  ];
  final _items = [
    BottomNavigationBarItem(icon: Icon(Icons.home), title: Text('home')),
    BottomNavigationBarItem(icon: Icon(Icons.event), title: Text('events')),
    BottomNavigationBarItem(
        icon: Icon(Icons.save_alt), title: Text('downloads')),
  ];
}
JenishHirpara commented 4 years ago

@IMEF-FEMI Thank you so much!! It works perfect now