FlutterRefreshIndicatorCustomScrollView

FlutterRefreshIndicatorCustomScrollView.dart

import 'dart:math';

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) => MaterialApp(
        color: Colors.white,
        home: Scaffold(
            appBar: AppBar(
              title: Text('Pull to refresh sample'),
            ),
            body: MyHomePage()),
      );
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  static int _randomNumbersCount = 20;
  List<int> randomNumbers;

  @override
  void initState() {
    super.initState();
    randomNumbers = _randomNumbers;
  }

  @override
  Widget build(BuildContext context) => RefreshIndicator(
        onRefresh: _refreshRandomNumbers,
        child: CustomScrollView(
          slivers: [
            _sliverListView,
            _sliverGridView,
          ],
        ),
      );

  SliverList get _sliverListView => SliverList(delegate: _sliverChildBuilderDelegate);

  SliverGrid get _sliverGridView => SliverGrid(
        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 2, childAspectRatio: 4),
        delegate: _sliverChildBuilderDelegate,
      );

  SliverChildBuilderDelegate get _sliverChildBuilderDelegate => SliverChildBuilderDelegate(
        (context, index) => Text(
          'number: ${randomNumbers[index]}',
          style: TextStyle(fontSize: 20, height: 1.5),
        ),
        childCount: _randomNumbersCount,
      );

  // Pretends we fetch the data from server and it takes time.
  Future<void> _refreshRandomNumbers() => Future.delayed(Duration(seconds: 2), () {
        setState(() => randomNumbers = _randomNumbers);
      });

  List<int> get _randomNumbers => List.generate(
        _randomNumbersCount,
        (index) => Random().nextInt(_randomNumbersCount),
      );
}