Flutter 和 Firebase 中列表頂部和底部的雙 RefreshIndicator

Question

我現在正在用 Flutter 制作 Flutter 應用程序。 應用程序概念是像 Facebook 這樣的 SNS。

當用戶第一次打開應用程序時，應用程序將顯示一個帶有 FutureBuilder 的帖子列表。 這個 FutureBuilder 將獲取過程作為“未來”參數，它會在第一時間找到最新的 5 個帖子。

現在我想用 RefreshIndicator 添加 refresh function，它在用戶滾動帖子列表頂部時起作用。 使用 RefreshIndicator，我刷新了 function 以查找用戶打開應用程序后創建的帖子。 但是，在用戶打開時獲得的第 5 個帖子之前創建的舊帖子呢？ 如何使用 RefreshIndicator 再添加一個刷新 function，它可以在用戶滾動帖子列表底部時起作用？

請給我一些提示。

Answer 1

要檢測用戶是否滾動到 ListView 的底部，您可以向 ScrollController 添加一個偵聽器。

var _scrollController = ScrollController();

...

@override
void initState() {
  super.initState();

  _scrollController.addListener(() {
    if (_scrollController.position.atEdge) {
      if (_scrollController.position.pixels == 0)
        debugPrint('Grid scroll at top');
      else {
        debugPrint('Grid scroll at bottom');
        
        // Scroll at the bottom, load more items on the List
        loadMore();
      }
    }
  });
}

然后在您的 ListView 上添加 ScrollController。

ListView.builder(
  controller: _scrollController,
  ...
)