使用Pageview.builder在Flutter中进行分页

时间:2020-08-28 22:24:04

标签: flutter dart flutter-pageview

我正在尝试实现分页,但是找不到任何有关如何创建控制器Listener函数或将其放置在何处的示例。请指教。让我知道是否也应该添加更多信息。

当前,我的侦听器功能如下:

(within initState)
    pagecontroller.addListener(() {
      print(pagecontroller.page);
      if (pagecontroller.page == _postslist.length-1) {
        fetchMore();
      }
    });

当前发生的情况是该函数仅被调用一次,随后再也不会被调用。

2 个答案:

答案 0 :(得分:1)

我不知道这个问题是否仍然存在(自从你问起已经六个月了),但由于这个问题仍然没有标记为正确的答案,我会尝试。

如果我理解正确,您希望在到达 PageView 的最后一个项目后将更多项目加载到您的 PageView 中。为此,您的 initState 中不需要侦听器。您只需检查是否已到达 onPageChanged 中的最后一个项目,然后加载更多项目。

它应该是这样工作的:

PageView.builder(
                      controller: _pageController,
                      itemCount: _items.length,
                      onPageChanged: (i) {
                        
                        if (i == _items.length - 1) {
                         getMoreItems().then((value) {
                            setState(() {
                              _items= value;
                            });
                          });
                        }
                      },
)

答案 1 :(得分:0)

我猜您正在尝试监听pageController来获取currentPage。在这种情况下,您应该使用its methods(animateToPage,jumpToPage,nextPage,previousPage)使用PageController触发事件,以便它可以唤起您的侦听器。

我认为我的页面转换是由PageView.builder处理的

您可以在文档中找到PageView.builder描述,如下所示:

此构造函数适用于具有大量(或无限多个)子级的页面视图,因为仅针对那些实际可见的子级调用该构建器。

因此,在有大量页面的情况下,它支持您有效地构建屏幕。您仍然需要自己处理页面之间的导航。

我上面包含的链接提供了一个示例,您可以参考PageController的用法。为了方便起见,这里将其包括在内:

class MyPageView extends StatefulWidget {
  MyPageView({
    Key key
  }): super(key: key);

  _MyPageViewState createState() => _MyPageViewState();
}

class _MyPageViewState extends State < MyPageView > {
  PageController _pageController;

  @override
  void initState() {
    super.initState();
    _pageController = PageController();
  }

  @override
  void dispose() {
    _pageController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: PageView(
          controller: _pageController,
          children: [
            Container(
              color: Colors.red,
              child: Center(
                child: RaisedButton(
                  color: Colors.white,
                  onPressed: () {
                    if (_pageController.hasClients) {
                      _pageController.animateToPage(
                        1,
                        duration: const Duration(milliseconds: 400),
                          curve: Curves.easeInOut,
                      );
                    }
                  },
                  child: Text('Next'),
                ),
              ),
            ),
            Container(
              color: Colors.blue,
              child: Center(
                child: RaisedButton(
                  color: Colors.white,
                  onPressed: () {
                    if (_pageController.hasClients) {
                      _pageController.animateToPage(
                        0,
                        duration: const Duration(milliseconds: 400),
                          curve: Curves.easeInOut,
                      );
                    }
                  },
                  child: Text('Previous'),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}