搜尋套件、儲存庫與 APP 分類

套件詳情v1.3.0

lazy_load_scrollview

一個 ScrollView 的包裝器,當到達頁面底部時會觸發回調

AndroidiOSWebmacOSWindowsLinux
近 30 天下載
2.3萬
喜歡數
434
Pub 分數
150

安裝套件

flutter pub add lazy_load_scrollview

套件介紹

根據套件公開資料產生的選型評估,僅供參考。

一個 Flutter 套件,用於包裝 ScrollView,當使用者滾動到可滾動內容的底部時觸發回調。此套件專為實作無限捲動或懶加載清單與網格而設計,非常適合分頁資料檢索。該套件可在所有主要平台(包括 Android、iOS、Web、macOS、Windows 和 Linux)上運作。它簡化了偵測捲動位置並動態載入更多資料的過程,無需複雜的自訂邏輯。

適用情境

  • 無限滾動列表
  • 懶加載圖片或資料
  • 網頁應用中的分頁內容
  • 動態列表更新
  • 滾動時加載更多項目

主要特色

  • 自動底部檢測
  • 跨平台支援
  • 簡單的回調機制
  • 最小化樣板程式碼
  • 適用於 ListView、GridView 及其他可滾動元件

適合對象

  • 開發分頁 UI 的開發者
  • 大型資料集的應用程式
  • 內容密集型介面
  • 需要動態加載的 Web 和行動應用程式

使用建議

  • 需要正確處理加載狀態
  • 快速捲動時可能需要防抖
  • 不適用於固定大小的清單
  • 應與錯誤處理結合使用
  • 性能取決於資料來源的效率

原始 README

以下為關聯原始碼儲存庫的 README 原文快照,最新內容請造訪原始碼儲存庫。

Lazy load scrollview

A wrapper for a ScrollView that will enable lazy loading

Usage

Add lazy_load_scrollview dependency to your pubspec.yaml:

dependencies:
  lazy_load_scrollview: 1.3.0

In your Dart code, import package:lazy_load_scrollview/lazy_load_scrollview.dart Then you can wrap your ListView, GridView, RefreshIndicator etc with the LazyLoadScrollView. Make sure you add an endOfPageListener which will receive the call when the bottom of the list has been reached.

import 'package:lazy_load_scrollview/lazy_load_scrollview.dart';


@override
Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: LazyLoadScrollView(
        onEndOfPage: () => loadMore(),
        child: ListView.builder(
          itemCount: data.length,
          itemBuilder: (context, position) {
            return Text("Position $position");
          },
        ),
      ),
    );
}

Class definition


LazyLoadScrollView(
  endOfPageListener: () => loadMore(), // The callback when reaching the end of the list
  scrollOffset: 100 // Pixels from the bottom that should trigger a callback 
  child: Widget, // A subclass of `ScrollView`
);

所屬分類

原始碼儲存庫

使用此套件的專案