Pull to refresh is a user-friendly refreshing mechanism to fire refresh event without without clicking any button on a page.

Todays pull to refresh is a common things for most of the all major applications like Gmail ,twitter and face book apps.Today we are going to teach about building this feature using a 3rd party flutter package very easly.

If you are in beginners level read our some beginner guide to start flutter developments How to install a flutter package to your application using visual studio code, Implementing asynchronous request in Dart Flutter

A beautiful and custom refresh indicator for flutter highly inspired from Ramotion Pull Down to Refresh.

Installing

1. Depend on it

Add this to your package’s pubspec.yaml file:

dependencies:
  liquid_pull_to_refresh: ^2.0.0

2. Install it

You can install packages from the command line:

with pub:

$ pub get

with Flutter:

$ flutter packages get

3. Import package to your project

in your page code, you can use:

import 'package:liquid_pull_to_refresh/liquid_pull_to_refresh.dart';

Usage

For adding this refresh indicator in your flutter app, you need to call LiquidPullToRefresh with key,onrefresh,child as its parameter.

Note –LiquidPullToRefresh   only be used with a vertical scroll view.

For example:

LiquidPullToRefresh(
        key: _refreshIndicatorKey,	// key 
        onRefresh: _RefreshCallBack,	// refresh callback event
        child: ListView(),		// scroll view
      );