# flutter_paging

**Repository Path**: OpenFlutter/flutter_paging

## Basic Information

- **Project Name**: flutter_paging
- **Description**: Flutter 分页加载。
- **Primary Language**: Unknown
- **License**: MulanPSL-1.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 1
- **Created**: 2019-09-18
- **Last Updated**: 2024-05-29

## Categories & Tags

**Categories**: cross-platform-mobiledev

**Tags**: None

## README

# flutter_paging [![pub package](https://img.shields.io/pub/v/flutter_paging.svg)](https://pub.dartlang.org/packages/flutter_paging)

Paging your widgets. Decoupling UI and data.


<img src="./arts/paging.gif" width="300" height="480">


Note: This plugin is still under development. [Pull Requests](https://github.com/OpenFlutter/flutter_paging/pulls) are most welcome.


## Installation

First, add `flutter_paging` as a [dependency in your pubspec.yaml file](https://flutter.io/using-packages/).

## Widgets Included

- PagingView : Base paging view.

- PagingListView : Quick implementation of ListView supports paging.

## KeyedDataSource

`KeyedDataSource` is core of paging. Try something else with `KeyedDataSource`  

Note: don't forget to call `dataSource.init()`


## Example

```dart

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Paging ListView"),
      ),
      body: RefreshIndicator(
        onRefresh: widget.dataSource.refresh,
        child: PagingListView<String>.builder(
          itemBuilder: (context, index, item) {
            return Card(
                child: Padding(
              padding: const EdgeInsets.all(8.0),
              child: Text("paging->$item"),
            ));
          },
          dataSource: widget.dataSource,
          loadingIndicator: Center(
            child: Padding(
              padding: const EdgeInsets.all(8.0),
              child: CircularProgressIndicator(),
            ),
          ),
          noMoreDataAvailableItem: Center(
            child: Padding(
              padding: const EdgeInsets.all(8.0),
              child: Text("no more data avaliable~"),
            ),
          ),
        ),
      ),
    );
  }

```