Flutter分页管理插件gamma_smart_pagination的使用

Flutter分页管理插件gamma_smart_pagination的使用

简介

gamma_smart_pagination 是一个用于实现无限滚动分页的Flutter插件，支持下拉刷新功能。它可以帮助开发者轻松地实现分页加载和刷新的功能，同时提供了多种状态（如加载中、刷新中、无更多数据等）的指示器。

功能特点

• 下拉刷新：用户可以通过下拉手势刷新数据。
• 上拉加载更多：当用户滚动到底部时，自动加载更多数据。
• 多种控制器状态：支持加载中、刷新中、无更多数据、加载失败、刷新失败等多种状态。
• 状态指示器：提供不同的Widget来显示当前的状态，例如无数据、加载失败、无更多数据等。

支持的平台

• Flutter Android
• Flutter iOS
• Linux (未测试)
• Windows (未测试)
• MacOS (未测试)
• Fuchsia (未测试)

安装

在 pubspec.yaml 文件中添加以下依赖：

dependencies:
  gamma_smart_pagination: ^1.0.4

然后在Dart文件中导入该插件：

import 'package:gamma_smart_pagination/gamma_smart_pagination.dart';

使用方法

1. 创建一个 GammaSmartPagination 小部件。
2. 将其包裹在任何可滚动的小部件（如 ListView 或 GridView）外部。
3. 传递所需的 GammaController 和 ScrollController，以及其他可用的参数。

注意事项

GammaSmartPagination 实际上是一个 SingleChildScrollView，因此需要注意父级小部件的高度不能是无限的。对于包裹在 GammaSmartPagination 内部的 ListView，需要设置 shrinkWrap: true 和 physics: NeverScrollableScrollPhysics()，以避免滚动冲突。

完整示例代码

以下是一个完整的示例代码，展示了如何使用 gamma_smart_pagination 插件来实现分页加载和刷新功能。

import 'package:flutter/material.dart';
import 'package:gamma_smart_pagination/gamma_smart_pagination.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Gamma Smart Pagination Example',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: ExampleApp(),
    );
  }
}

class ExampleApp extends StatefulWidget {
  const ExampleApp({super.key});

  [@override](/user/override)
  State<ExampleApp> createState() => _ExampleAppState();
}

class _ExampleAppState extends State<ExampleApp> {
  // 初始化控制器
  GammaController gammaController = GammaController();
  ScrollController scrollController = ScrollController();

  // 模拟的数据列表
  List<String> itemsList = [];
  bool isLoading = false;

  [@override](/user/override)
  void initState() {
    super.initState();
    // 初始化时加载数据
    fetchItems();
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Gamma Smart Pagination Example'),
      ),
      body: SafeArea(
        child: isLoading ? _getLoadingIndicator : _buildBody(),
      ),
    );
  }

  // 构建主页面内容
  Widget _buildBody() {
    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: <Widget>[
        Expanded(
          // 关键部分：使用 GammaSmartPagination 包裹 ListView
          child: GammaSmartPagination(
            gammaSmartController: gammaController,
            scrollController: scrollController,
            onLoadMore: () => loadMore(), // 加载更多数据的回调
            onRefresh: () => refreshItems(), // 刷新数据的回调
            itemCount: itemsList.length, // 数据项的数量
            header: Container(
              height: 300.0,
              color: Colors.orange, // 可选的头部Widget
            ),
            child: ListView.separated(
              shrinkWrap: true, // 必须设置为 true
              physics: const NeverScrollableScrollPhysics(), // 必须设置为 NeverScrollableScrollPhysics
              itemBuilder: (context, index) => ListTile(
                title: Text(itemsList[index]),
              ),
              separatorBuilder: (context, index) => const Divider(),
              itemCount: itemsList.length,
            ),
          ),
        ),
      ],
    );
  }

  // 显示加载中的指示器
  Widget get _getLoadingIndicator => const Center(
        child: CircularProgressIndicator(),
      );

  // 模拟从网络获取数据
  Future<void> fetchItems() async {
    setState(() {
      isLoading = true;
    });
    await Future.delayed(const Duration(seconds: 1)); // 模拟网络延迟
    final fakeItems = List.generate(10, (index) => 'Item ${index + 1}');
    // 更新控制器状态为闲置
    gammaController.setIdle();
    setState(() {
      itemsList = fakeItems;
      isLoading = false;
    });
  }

  // 模拟加载更多数据
  Future<void> loadMore() async {
    await Future.delayed(const Duration(seconds: 1)); // 模拟网络延迟
    final fakeItems = List.generate(10, (index) => 'Item ${itemsList.length + index + 1}');
    // 更新控制器状态为加载完成
    gammaController.setLoadingCompleted();
    setState(() {
      itemsList = [...itemsList, ...fakeItems];
    });
  }

  // 模拟刷新数据
  Future<void> refreshItems() async {
    await Future.delayed(const Duration(seconds: 1)); // 模拟网络延迟
    final fakeItems = List.generate(10, (index) => 'Item ${index + 1}');
    // 更新控制器状态为刷新完成
    gammaController.setRefreshingCompleted();
    setState(() {
      itemsList = fakeItems;
    });
  }

  [@override](/user/override)
  void dispose() {
    // 释放控制器资源
    gammaController.dispose();
    scrollController.dispose();
    super.dispose();
  }
}