Flutter pull_to_refresh widget

Overview

pull_to_refresh

A widget that provided to pull-up load and pull-down refresh with Flutter.

Features

  • pull up and pull down
  • Simple interface, easy access
  • support most of the component in Flutter such as scroll and non-scroll component

Show cases

Quick Start

  1. Add import package:pull_to_refresh/pull_to_refresh_widget.dart;
  2. Using PullToRefreshWidget wrap outside your content widget
PullToRefreshWidget(
    isRefreshEnable: true,
    headerBuilder: _buildHeaderWidget,
    onRefresh: _handleRefresh,
    isLoadMoreEnable: hasMore,
    onLoadMore: _onLoadMore,
    footerBuilder: _buildFootWidget,
    child: ListView.builder(
        itemCount: items.length,
        itemBuilder: (context, index) {
        return new ListTile(
            title: Text("Index$index"),
        );
    }));
  1. You should set the headerBuilder and footerBuilder in PullToRefreshWidget that generate header widget and footer widget. The header widget must inherit DefaultRefreshHeaderWidget.
DefaultRefreshHeaderWidget _buildHeaderWidget(BuildContext context) {
    return DefaultRefreshHeaderWidget();
  }

Widget _buildFootWidget(BuildContext context) {
    return new Container(
      alignment: Alignment.center,
      height: 60.0,
      child: new Center(
        child: new Row(
            textDirection: TextDirection.ltr,
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              new Text("正在加载中。。。"),
              new CircularProgressIndicator(strokeWidth: 2.0)
            ]),
      ),
    );
  }
  1. The onRefresh and onLoadMore will be callback when the indicator state is refreshed and load more. The function returned [Future] must complete when the refresh operation is finished.
  Future<Null> _handleRefresh() async {
    await Future.delayed(Duration(seconds: 50), () {
      setState(() {
        items.clear();
        items = List.generate(40, (i) => i);
      });
    });
  }

  Future<Null> _onLoadMore() async {
    await Future.delayed(Duration(seconds: 50), () {
      setState(() {
        if (index == 2) {
          hasMore = false;
        }
        int length = items.length;
        index++;
        items.addAll(List.generate(16, (i) => i + length));
      });
    });
  }

full example see here: main.dart.

You might also like...

Iridium-reader-widget - Plug and play reader widget allowing to easily integrate an Iridium viewer inside any app

Plug and play reader widget allowing to easily integrate an Iridium viewer insid

Dec 31, 2022

Kullanmaya hazir widget cozumleri -Ready to use widget solutions

Ready to use widgets ( 🇹🇷 ) Projelerimde yararlı widget çözümleri kullanıyorum ve çoğu zaman orada kalıyor. Bunları hem ben hemde sizden gelenler il

Dec 27, 2022

This widget automatically scrolls the custom child widget to an infinite loop.

This widget automatically scrolls the custom child widget to an infinite loop.

Scroll Loop Auto Scroll This widget automatically scrolls the custom child widget to an infinite loop. Example Features Infinite Auto Scroll Custom ch

Dec 12, 2022

Widget that gives you the size of the widget in runtime.

Tailor Flutter widget that calculates the size of a widget in runtime. Usage Just wrap your widget with Tailor and get the size in the builder. The bu

Nov 2, 2022

Flutter mapbox - This Flutter plugin allows to show embedded interactive and customizable vector maps inside a Flutter widget

Flutter mapbox - This Flutter plugin allows to show embedded interactive and customizable vector maps inside a Flutter widget

Flutter Mapbox GL Please note that this project is community driven and is not a

Jan 31, 2022

QR.Flutter is a Flutter library for simple and fast QR code rendering via a Widget or custom painter.

QR.Flutter is a Flutter library for simple and fast QR code rendering via a Widget or custom painter.

QR.Flutter is a Flutter library for simple and fast QR code rendering via a Widget or custom painter. Need help? Please do not submit an issue for a "

Jan 8, 2023

A Flutter widget for rendering static html as Flutter widgets (Will render over 80 different html tags!)

A Flutter widget for rendering static html as Flutter widgets (Will render over 80 different html tags!)

flutter_html A Flutter widget for rendering HTML and CSS as Flutter widgets. Screenshot 1 Screenshot 2 Screenshot 3 Table of Contents: Installing Curr

Jan 5, 2023

A Flutter widget for rendering HTML and CSS as Flutter widgets

A Flutter widget for rendering HTML and CSS as Flutter widgets

flutter_html A Flutter widget for rendering HTML and CSS as Flutter widgets. Screenshot 1 Screenshot 2 Screenshot 3 Table of Contents: Installing Curr

Dec 15, 2021

Flutter tableview - A flutter widget like iOS UITableview. let listView with section header and each section header will hover at the top.

Flutter tableview - A flutter widget like iOS UITableview. let listView with section header and each section header will hover at the top.

中文 flutter_tableview A flutter widget like iOS UITableview. let listView with section header and each section header will hover at the top. Installing

Jul 22, 2022
Owner
Bytedance Inc.
Bytedance Inc.
MindInventory 15 Sep 5, 2022
A simple detailed flutter widget that looks almost the same as the real instagram mention widget.

Instagram Mention Widgets 'small details do matter' ❤️ This package provides simple and almost the same UI details that the real Instagram mention wid

AbdulMuaz Aqeel 20 Oct 10, 2022
A customizable carousel slider widget in Flutter which supports inifinte scrolling, auto scrolling, custom child widget, custom animations and built-in indicators.

flutter_carousel_widget A customizable carousel slider widget in Flutter. Features Infinite Scroll Custom Child Widget Auto Play Horizontal and Vertic

NIKHIL RAJPUT 7 Nov 26, 2022
A flutter widget which renders its child outside the original widget hierarchy.

overlay_container A flutter widget which renders its child outside the original widget hierarchy. Demo. This demo is present as an example here. You c

Mustansir Zia 30 Jun 10, 2022
Behruz Hurramov 0 Dec 29, 2021
FT-Custom-Widget - A Custom Widget Built With Flutter

Custom Widget Watch it on YouTube Product Screen Sample when you implement compl

Firgia 5 Mar 29, 2022
A Flutter widget to show an icon collection to pick. This widget extend TextField and has a similar behavior as TextFormField

icon_picker A Flutter widget to show an icon collection to pick. This widget extend TextField and has a similar behavior as TextFormField Usage In the

m3uzz Soluções em TI 11 Sep 27, 2022
Flip widget - A Simple Flip widget For Flutter

flip_widget Flip your widget. Usage FlipWidget( key: _flipKey, child: Co

null 24 Nov 13, 2022
A new Flutter project. Use of Padding Class(Widget) and Card Class (Widget)

Use_Of_Card_And_Padding_Class A new Flutter project. Use of Padding Class(Widget) and Card Class (Widget) Getting Started This project is a starting p

Avinandan Bose 1 Mar 18, 2022
Custom dropdown widget allows to add highly customizable widget in your projects with proper open and close animations and also comes with form required validation.

Custom Dropdown Custom Dropdown package lets you add customizable animated dropdown widget. Features Lots of properties to use and customize dropdown

Abdullah Chauhan 22 Dec 29, 2022