时间戳

首页 > 解决方案 > Flutter: Pageview builder : 有效地激活和停用监听器

flutter - Flutter: Pageview builder : 有效地激活和停用监听器

问题描述

我在 Pageviewbuilder 的帮助下创建了一个无限的页面列表。

 body: PageStorage(
      bucket: bucket,
      child: PageView.builder(
          scrollDirection: Axis.vertical,
          physics: ClampingScrollPhysics(),              
          controller: controller,
          itemBuilder: (BuildContext context, int index) {
            return Page(index: index, controller: controller);
          }),
    ));

控制器设置为：

 controller = PageController(
  viewportFraction: 1.0,
);

为页面获取数据的监听器分别在上述页面小部件的 initState() 和 dispose() 中附加/分离：

void initState() {
super.initState();
print('Init State of Page ${widget.index} called..');
//--- Listener activate ---

}

void dispose() {
super.dispose();
//--- Listener Deactivate ---

}

虽然这没有问题，但有两个观察结果：

  1. 当用户从 Page-1 到 Page-2 进行最轻微的滚动时，即使在下一页进入视图之前以及当释放滚动，Page-2 的 dispose() 被滚动。
  2. 滚动方向设置为垂直。但是，在 Page-2 中，如果用户尝试水平滚动，则会出现轻微的抖动，从而导致 Page-1 的构建启动。

我打算实现的目标：

任何输入都会非常有帮助。谢谢你。

标签： flutter

解决方案

要侦听 PageView 上的页面更改，您可以使用PageView.onPageChanged(int)- 每当视口中显示的页面发生更改时调用，如docs中所述。

PageView.builder(
  onPageChanged: (int page){
    // Do something
  },
  scrollDirection: Axis.vertical,
  physics: ClampingScrollPhysics(),              
  controller: controller,
  itemBuilder: (BuildContext context, int index) {
    return Page(index: index, controller: controller);
  },
),

推荐阅读