Flutter下拉刷新功能插件pull_refresh_widget的使用

Flutter下拉刷新功能插件pull_refresh_widget的使用

A Flutter package allows you to add pull refresh widget as listview builder or column

👨‍💻 Developed by:

👨🏻‍💻 Find me :

Preview:

Setup

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

dependencies:
  pull_refresh_widget: <last_version>

Getting Started

Sample example:

import 'package:pull_refresh_widget/pull_refresh_widget.dart';
ScrollController _controller = ScrollController();
String text = "Pull To Refresh";

RefreshScrollColumn(
  controller: _controller,
  onRefresh: () {
    print('Refreshing');
  },
  onRefreshEnd: () {
    print('Refreshed');
    setState(() {
      text = 'Refreshed';
    });
  },
  children: [
    Container(
      alignment: Alignment.center,
      height: 100,
      width: 300,
      child: Text(
        text,
        style: TextStyle(color: Colors.red, fontSize: 30),
      ),
    ),
  ],
)

To use RefreshScrollColumn()

import 'package:pull_refresh_widget/pull_refresh_widget.dart';
ScrollController _controller = ScrollController();
String text = "Pull To Refresh";

RefreshScrollColumn(
  controller: _controller,
  onRefresh: () {
    print('Refreshing');
  },
  onRefreshEnd: () {
    print('Refreshed');
    setState(() {
      text = 'Refreshed';
    });
  },
  children: [
    Container(
      alignment: Alignment.center,
      height: 100,
      width: 300,
      child: Text(
        text,
        style: TextStyle(color: Colors.red, fontSize: 30),
      ),
    ),
  ],
)

To use RefreshListViewBuilder()

RefreshListViewBuilder(
  controller: _controller,
  onRefresh: () {
    print("refreshed");
  },
  itemBuilder: (context, index) {
    return Text('$index');
  }
)

Parameters of the RefreshScrollColumn()

final ScrollController controller;

final List<Widget> children;

final Widget? loadingWidget;

final Color? iconsColor;

final void Function() onRefresh;

final void Function()? onRefreshEnd;

final Duration? refreshTime;

final MainAxisAlignment? mainAxisAlignment;
final MainAxisSize? mainAxisSize;
final CrossAxisAlignment? crossAxisAlignment;
final TextDirection? textDirection;
final VerticalDirection? verticalDirection;
final TextBaseline? textBaseline;

Parameters of the RefreshListViewBuilder()

final ScrollController controller;

final Widget? loadingWidget;

final Color? iconsColor;

final void Function() onRefresh;

final void Function()? onRefreshEnd;

final Duration? refreshTime;

final NullableIndexedWidgetBuilder itemBuilder;

final Axis scrollDirection = Axis.vertical;

final bool reverse = false;

final bool? primary;

final ScrollPhysics? physics;

final bool shrinkWrap = false;

final EdgeInsetsGeometry? padding;

final double? itemExtent;

final Widget? prototypeItem;

final int? Function(Key)? findChildIndexCallback;

final int? itemCount;

final bool addAutomaticKeepAlives = true;

final bool addRepaintBoundaries = true;

final bool addSemanticIndexes = true;

final double? cacheExtent;

final int? semanticChildCount;

final DragStartBehavior dragStartBehavior = DragStartBehavior.start;

final ScrollViewKeyboardDismissBehavior keyboardDismissBehavior = ScrollViewKeyboardDismissBehavior.manual;

final String? restorationId;

final Clip clipBehavior = Clip.hardEdge;

final MainAxisAlignment? mainAxisAlignment;

final MainAxisSize? mainAxisSize;

final CrossAxisAlignment? crossAxisAlignment;

final TextDirection? textDirection;

final VerticalDirection? verticalDirection;

final TextBaseline? textBaseline;

示例代码

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

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

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  [@override](/user/override)
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;
  ScrollController _controller = ScrollController();
  String text = "Pull To Refresh";

  void _incrementCounter() {
    setState(() {
      _counter++;
    });
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),
      ),
      body: Container(
        width: MediaQuery.of(context).size.width,
        height: MediaQuery.of(context).size.height,
        child: RefreshScrollColumn(
          crossAxisAlignment: CrossAxisAlignment.center,
          controller: _controller,
          onRefresh: () {
            print('Refreshing');
            setState(() {
              text = 'Refreshing';
            });
          },
          onRefreshEnd: () {
            print('Refreshed');
            setState(() {
              text = 'Refreshed';
            });
          },
          children: [
            Container(
              alignment: Alignment.center,
              height: 100,
              width: 300,
              child: Text(
                text,
                style: TextStyle(color: Colors.red, fontSize: 30),
              ),
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: const Icon(Icons.add),
      ),
    );
  }
}