listview_utils 0.1.6+1

  • Readme
  • Changelog
  • Example
  • Installing
  • 85

📃 ListView Utils #

Additional utils for flutter ListView component.

🌟 Getting Started #

Add those lines to pubspec.yaml file and run flutter pub get.

dependencies:
  listview_utils: ^0.1.5

Check out Installing tab for more details.

Import listview_utils package to your application by adding this line:

import 'package:listview_utils/listview_utils.dart';

This will import required classes to use listview_utils.

⚙ Properties #

CustomListView( 
  // Items fetched per request (default: 30)
  pageSize: 30,

  // Header widget (default: null)
  header: Container(...),

  // Footer widget (default: null)
  footer: Container(...),

  // The widget that displayed if the list is empty (default: null)
  empty: Text('List is empty'),

  // Item provider adapter (default: null)
  adapter: ListAdapter(
    fetchItems: (int offset, int limit) {
      return ListItems([ ... ]);
    },
  ),

  // A callback function to build list items (required)
  itemBuilder: (BuildContext context, int index, dynamic item) {
    // If items provided by adapter the `item` argument will be matching element
    return ListTile(
      title: Text(item['title']),
    );
  },

  // Callback function to build widget if exception occurs during fetching items
  errorBuilder: (BuildContext context, LoadErrorDetails details, CustomListViewState state) {
    return Column(
      children: <Widget>[
        Text(details.error.toString()),
        RaisedButton(
          onPressed: () => state.loadMore(),
          child: Text('Retry'),
        ),
      ],
    );
  },

  // Static list of items
  children: <Widget>[
    ...
  ],

  // Item count
  itemCount: 45,

  // A callback function called when required to load more items
  onLoadMore: () async {
    ...
  },

  // A callback function called when pull to refresh is triggered
  onRefresh: () async {
    ...
  },

  // Enable / disable pull to refresh (default: false)
  disableRefresh: false,
),

🔌 Adapters #

ListView Utils currently only supports network adapter. Or you could write your own adapter by implementing BaseListAdapter mixin or using ListAdapter class.

Here's simple network adapter code using jsonplaceholder data.

NetworkListAdapter(
  url: 'https://jsonplaceholder.typicode.com/posts',
  limitParam: '_limit',
  offsetParam: '_start',
),

📝 Example #

CustomListView(
  loadingBuilder: CustomListLoading.defaultBuilder,
  itemBuilder: (context, index, item) {
    return ListTile(
      title: Text(item['title']),
    );
  },
  adapter: NetworkListAdapter(
    url: 'https://jsonplaceholder.typicode.com/posts',
    limitParam: '_limit',
    offsetParam: '_start',
  ),
);

[0.1.6+1] - 3/12/2020 #

  • Fixed memory leak issue

[0.1.6] - 3/5/2020 #

  • Added disablePagination property to NetworkListAdapter

[0.1.5] - 3/2/2020 #

  • Added errorBuilder property to CustomListView
  • Added StaticListAdapter
  • Improved loading items using adapter by using debounce timer

[0.1.4] - 3/2/2020 #

  • Added headers property to NetworkListAdapter

[0.1.3] - 3/2/2020 #

  • Renamed from listutils to listview_utils
  • Example code simplified

[0.1.0] - 3/1/2020 #

  • Fixed major bugs
  • Added example project
  • Readme created

[0.0.2] - 3/1/2020 #

  • Added description

[0.0.1] - 3/1/2020 #

  • Initial release

example/lib/main.dart

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

void main() {
  runApp(MaterialApp(
    title: 'Example',
    home: Scaffold(
      body: CustomListView(
        loadingBuilder: CustomListLoading.defaultBuilder,
        header: Container(
          height: 50,
          child: Center(
            child: Text('Header'),
          ),
        ),
        footer: Container(
          height: 50,
          child: Center(
            child: Text('Footer'),
          ),
        ),
        adapter: NetworkListAdapter(
          url: 'https://jsonplaceholder.typicode.com/posts',
          limitParam: '_limit',
          offsetParam: '_start',
        ),
        errorBuilder: (context, details, state) {
          return Column(
            children: <Widget>[
              Text(details.error.toString()),
              RaisedButton(
                onPressed: () => state.loadMore(),
                child: Text('Retry'),
              ),
            ],
          );
        },
        separatorBuilder: (context, _) {
          return Divider(height: 1);
        },
        itemBuilder: (context, _, item) {
          return ListTile(
            title: Text(item['title']),
            leading: Icon(Icons.assignment),
          );
        },
      ),
    ),
  ));
}

Use this package as a library

1. Depend on it

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


dependencies:
  listview_utils: ^0.1.6+1

2. Install it

You can install packages from the command line:

with Flutter:


$ flutter pub get

Alternatively, your editor might support flutter pub get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:


import 'package:listview_utils/listview_utils.dart';
  
Popularity:
Describes how popular the package is relative to other packages. [more]
70
Health:
Code health derived from static analysis. [more]
100
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
100
Overall:
Weighted score of the above. [more]
85
Learn more about scoring.

We analyzed this package on Apr 7, 2020, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.7.1
  • pana: 0.13.6
  • Flutter: 1.12.13+hotfix.8

Dependencies

Package Constraint Resolved Available
Direct dependencies
Dart SDK >=2.2.2 <3.0.0
flutter 0.0.0
http ^0.12.0 0.12.0+4
provider ^4.0.0 4.0.4 4.1.0-dev+2
Transitive dependencies
async 2.4.1
charcode 1.1.3
collection 1.14.11 1.14.12
http_parser 3.1.4
meta 1.1.8
nested 0.0.4
path 1.6.4
pedantic 1.9.0
sky_engine 0.0.99
source_span 1.7.0
string_scanner 1.0.5
term_glyph 1.1.0
typed_data 1.1.6
vector_math 2.0.8
Dev dependencies
flutter_test