uic 0.2.0

A set of Flutter UI components that simplifies implementing most used UI cases.

uic

UIC (UI Components)

A set of Flutter widgets that simplifies implementing most used UI cases.

Currently includes the following UI components:

• ListUic - Wrapper of ListView, which implements related data loading and state management logic.
• ProgressUic - Wrapper of ProgressIndicator with additional text.

ListUic

Almost each app has screens that display a list of items. Simple task at first look, it often requires much related staff to be implemented. All that boilerplate can be simplified with ListUic widget.

Features:

• Pull to Refresh gesture to reload list data
• Pagination (infinite scroll) to load next part of data on scroll to the end of the list
• Progress indicator for initial data loading
• Individual view for empty data
• Individual error view
• Progress indicator at the end of list when next page of items is loading
• Showing snack bar on failing loading data

  

Usage

In the dependencies: section of your pubspec.yaml, add the following line:

dependencies:
  uic: ^0.1.0

ListUic

Import the package

import 'package:uic/list_uic.dart';

Add ListUicController to your page's state:

class _MyHomePageState extends State<MyHomePage> {

  ListUicController<int> _controller;
  ...
  
  @override
  void initState() {
    super.initState();
    _controller = ListUicController<int>(
      onGetItems: (int page) => _getItems(page),
    );
    ...
  }
  ...
}

Add ListUic widget to your widget tree:

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: ListUic<int>(
        controller: _controller,
        itemBuilder: (item) {
          return ListTile(
            title: Text('Title ${item}'),
            subtitle: Text('Subtitle ${item}'),
          );
        },
      ),
    );
  }

Implement a function that will return a list of items:

  Future<List<int>> _getItems(int page) async {
    ...
  }

Read the docs for available customization options.

Also you can check demo app for details of using ListUic widget.