5

I want to move backward when press the back button using a pageView, I read about the WillPopScope component, but I am not pushing/poping another screens. I am just moving in diferent pages on the pageView.

Any clue how to do that?

Best regards.

3 Answers3

10

Yep, you can achieve so using WillPopScope. Not sure if this is optimal though, but it works perfectly with me; keep in mind that I wanted the back button to work from the one of the pages to the one before it, and not over all pages, but I am sure the solution applies.

In the page, I surrounded everything with WillPopScope like this

return new WillPopScope(
  onWillPop: () => Future.sync(onWillPop),
  child: // Whatever your page was

Now, you will have to define the proc onWillPop, and it is like this in my case

bool onWillPop() {
  _controller.previousPage(
    duration: Duration(milliseconds: 200),
    curve: Curves.linear,
  );
  return false;
}

In my case, this never fails as it is only used in one of the views, and only one.

In your case, you may wanna condition like this:

bool onWillPop() {
  if (_controller.page.round() == _controller.initialPage)
    return true;
  else {
    _controller.previousPage(
      duration: Duration(milliseconds: 200),
      curve: Curves.linear,
    );
    return false;
  }
}

Hope this helps. For reference on overriding the back button in general, refer to this other StackOverFlowAnswer.

EDIT: Added a return value to my onWillPop to remove dart warning.

Smily
  • 2,732
  • 1
  • 15
  • 20
  • Hey I followed your answer. But I am having trouble, When I implement this in one of my PageView's page than other pages also behave similarly. I just want back from a single page not from other page. – CodeGeek Mar 22 '19 at 13:35
  • Each page has its own number, so if you want to enable this for one page alone, you can condition the controller's `page` attribute to be equal to yours before executing `previousPage` method. – Smily Mar 23 '19 at 14:41
1

You can use PageController to control your PageView.

    PageController _pageController;

You can use the PageController got to the previous page:

    _pageController.previousPage(duration: Duration(milliseconds: 300), curve: Curves.linear);

Or to go to the initial page:

     _pageController.jumpToPage(_pageController.initialPage);
braulio.cassule
  • 1,322
  • 4
  • 14
  • 23
  • Yeah, I know I can move forward or backward in the PageView using a button or something like that, but when I press the back button on the phone the app close, because the navigator **pop** the current view, but I want to move backward in the pageview instead. – Roger Villamarin Jul 25 '18 at 13:57
0

You can also write the onWillPop() like this:

if (_controller.page.round() == _controller.initialPage) {
      return true;
    } else {
      _controller.previousPage(
        duration: Duration(milliseconds: 200),
        curve: Curves.linear,
      );
      return false;
    }

So it always return a bool.

geegog
  • 35
  • 1
  • 5