Flutter: How to jump to last page dynamically created on a PageView

Question

I have a pageView displaying a list of pages.

Application provides a + button to add a new page at the end of the collection.

I need the pageView to automatically jump to the last page once this new page has been successfully created.

If I try to redisplay the view providing a provider with initialPosition set to last pageView index, it does not work

PageController(initialPage: 0, keepPage: false);

Any implementation idea ?

• Using listener (but which listener ?)

Complete code:

  @override
  Widget build(BuildContext context) {
    if (_userId == null) {
      return Scaffold(body: Center(child: Text("Loading experiences")));
    }
    print('Rebuilding entire view.');
    return Scaffold(
      appBar: new AppBar(
          title: StreamBuilder<ExperiencesInfo>(
              stream: _experiencesInfoStream,
              builder: (context, snapshot) {
                if (snapshot.hasData) {
                  _selectedExperience = snapshot.data.currentExperience;
                  return Text(snapshot.data.currentExperience.name);
                } else {
                  return Center();
                }
              }),
          ),
      body: new Container(
        padding: new EdgeInsets.only(
          top: 16.0,
        ),
        decoration: new BoxDecoration(color: Colors.yellow),
        child: Column(
          children: <Widget>[
            Expanded(
                child:
                StreamBuilder<List<Experience>>(
                    stream: _userExperiencesStream,
                    builder: (context, snapshot) {
                      if (snapshot.hasData) {
                        return  _createExperiencesPagesWidget(snapshot.data);
                      } else {
                        return Center();
                      }
                    })
            ),
            _buildPageIndicator(),
            Padding(
              padding: EdgeInsets.only(bottom: 20.0),
            )
          ],
        ),
      ),
      floatingActionButton: new FloatingActionButton(
          child: new Icon(Icons.add),
          onPressed: () {
            _displayAddMenu();
          }),
    );
  }



_createExperiencesPagesWidget(List<Experience> experiences) {
    print('Creating ExperiencesPagesWidget ${experiences}');
    return PageView.builder(
      physics: new AlwaysScrollableScrollPhysics(),
      controller: _pageController,
      itemCount: experiences.length,
      itemBuilder: (BuildContext context, int index) {
        return ConstrainedBox(
            constraints: const BoxConstraints.expand(),
            child: Column(children: <Widget>[
              _buildMoodIndicator(experiences[index]),
              _buildMoodSelector(),
            ]));
      },
      onPageChanged: (index) {
        if (_actionType == ActionType.none) {
          print('page changed to index: ${index}, updating stream.');
          _experiencesViewModel.experienceIndexSink.add(index);
        } else {
          _actionType = ActionType.none;
        }

      },
    );

Page controller is defined as a class property

PageController _pageController = PageController(initialPage: 0, keepPage: false);

Answer 1

PageController contains methods that you can use to dynamically switch between pages.

// Create the page controller in your widget
PageController _controller = PageController(initialPage: 0, keepPage: false);


// Use it in your page view
@override
Widget build(BuildContext context) {
  ...
  PageView(controller: _controller, ...);
  ...
}


void onAddButtonTapped() {
  // add the new page
  ...

  // use this to animate to the page
  _controller.animateToPage(lastIdx);

  // or this to jump to it without animating
  _controller.jumpToPage(lastIdx);
}