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.


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.


  • 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

ListUic Demo ListUic Demo ListUic Demo


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

  uic: ^0.1.0


Import the package

import 'package:uic/list_uic.dart';

Add ListUicController to your page's state:

class _MyHomePageState extends State<MyHomePage> {

  ListUicController<int> _controller;
  void initState() {
    _controller = ListUicController<int>(
      onGetItems: (int page) => _getItems(page),

Add ListUic widget to your widget tree:

  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.