桃缶食べたい。

import 'package:flutter/material.dart';

void main() => runApp(new InfiniteGridViewSampleWidget());

/// 無限にスクロールする GridView サンプルの StatefulWidget
class InfiniteGridViewSampleWidget extends StatefulWidget {
  @override
  InfiniteGridViewSampleState createState() =>
      new InfiniteGridViewSampleState();
}

/// 無限にスクロールする GridView サンプルの State
class InfiniteGridViewSampleState extends State<InfiniteGridViewSampleWidget> {
  // 表示するデータの List。
  // 初期値としてデータを 20 件いれておく。
  final List<int> items = new List.generate(20, (index) => index);

  // GridView を構築して返す。
  // この GridView を末尾までスクロールした場合、表示するデータ件数を増やして追加表示できるようにする。
  //
  // GridView が末尾までスクロールされたかは、GridView に設定した ScrollController によって検知できる。
  //
  // GridView に表示される要素の最大数は、GridView が構築された時点で固定される。
  // そのため、表示するデータ件数を増やすには、再度 GridView を再構築する必要がある。
  @override
  Widget build(BuildContext context) {
    // GridView のスクロールを検知するための ScrollController。
    final ScrollController _scrollController = new ScrollController();
    // ScrollController にイベントリスナーを設定する。
    _scrollController.addListener(() {
      // 最後までスクロールしたら、次のデータを読み込む。
      if (_scrollController.position.maxScrollExtent <=
          _scrollController.position.pixels) {
        // 表示するデータを追加し、ウィジェットを再構築するよう通知する。
        setState(() {
          // 表示するデータにさらに 20 件データを追加する。
          this.items.addAll(
              new List.generate(20, (index) => this.items.length + index));
        });
      }
    });

    // GridView の要素を表示されるタイミングで構築できるように itemBuilder を指定する。
    return new MaterialApp(
      home: new Scaffold(
        // itemBuilder を指定できる GridView.builder() で GridView を構築する。
        body: GridView.builder(
          itemBuilder: (BuildContext context, int index) {
            // itemBuilder は、引数 index の位置にある GridView の要素が表示されるタイミングで
            // 呼び出され、その要素を構築して返す。

            print("make item: ${index}");

            // 引数 index の位置にある GridView の要素を構築して返す。
            return new Center(child: new Text("#${index}"));
          },
          // GridView で表示するデータの件数を設定する。
          // これ以上の件数のデータを表示する場合、新たな itemCount 値を設定して GridView を再構築する必要がある。
          itemCount: items.length,
          // スクロールされたことを検知するため、ScrollController を設定する。
          controller: _scrollController,
          // GridView の要素は横に 3 個ずつ並べてレイアウトする。
          // これは、new GridView.count(crossAxisCount: 3, children: <Widget>[]) に相当する。
          // GridView の要素の配置は SliverGridDelegateWithFixedCrossAxisCount を設定することで指定できる。
          gridDelegate: new SliverGridDelegateWithFixedCrossAxisCount(
            crossAxisCount: 3,
          ),
        ),
      ),
    );
  }
}

GridView のスクロールイベントを検知する

// GridView のスクロールを検知するための ScrollController を作る。
final ScrollController _scrollController = new ScrollController();

// ScrollController に、スクロール時の処理をイベントリスナーとして設定する。
_scrollController.addListener(() {
  // 最後までスクロールしたら、次のデータを読み込む。
  if (_scrollController.position.maxScrollExtent <=
      _scrollController.position.pixels) {
    // 表示するデータを追加し、ウィジェットを再構築するよう通知する。
    setState(() {
      // 表示するデータにさらに 20 件データを追加する。
      this.items.addAll(
          new List.generate(20, (index) => this.items.length + index));
    });
  }
});

GridView.builder(
  // スクロールされたことを検知するため、ScrollController を設定する。
  controller: _scrollController
);

GridView の要素を表示されるタイミングで構築（遅延構築）する

GridView.builder(
  itemBuilder: (BuildContext context, int index) {
    // 引数 index の位置にある GridView の要素を構築して返す。
    return new Center(child: new Text("#${index}"));
  },
  // GridView で表示するデータの件数を設定する。
  // これ以上の件数のデータを表示する場合、新たな itemCount 値を設定して GridView を再構築する必要がある。
  itemCount: items.length,
);

itemBuilder 値を指定しつつ GridView の要素を 3 つずつ配置する

GridView.builder(
  // crossAxisCount 値を設定した SliverGridDelegateWithFixedCrossAxisCount を GridView.builder() に渡す
  gridDelegate: new SliverGridDelegateWithFixedCrossAxisCount(
    crossAxisCount: 3,
  ),
);

最後に