如何让Flutter GridView在滚动时变成分页？

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('Flutter GridView 分页')),
        body: PaginatedGridView(),
      ),
    );
  }
}

class PaginatedGridView extends StatefulWidget {
  @override
  _PaginatedGridViewState createState() => _PaginatedGridViewState();
}

class _PaginatedGridViewState extends State<PaginatedGridView> {
  final ScrollController _scrollController = ScrollController();
  List<int> _data = [];
  int _page = 0;
  final int _pageSize = 20;

  @override
  void initState() {
    super.initState();
    _loadMoreData();
    _scrollController.addListener(_scrollListener);
  }

  @override
  void dispose() {
    _scrollController.removeListener(_scrollListener);
    _scrollController.dispose();
    super.dispose();
  }

  void _loadMoreData() {
    // 模拟网络请求或其他数据加载操作
    Future.delayed(Duration(seconds: 1), () {
      setState(() {
        for (int i = 0; i < _pageSize; i++) {
          _data.add((_page * _pageSize) + i);
        }
        _page++;
      });
    });
  }

  void _scrollListener() {
    if (_scrollController.position.pixels == _scrollController.position.maxScrollExtent) {
      _loadMoreData();
    }
  }

  @override
  Widget build(BuildContext context) {
    return GridView.builder(
      controller: _scrollController,
      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
        crossAxisCount: 3,
        childAspectRatio: 1.0,
      ),
      itemCount: _data.length,
      itemBuilder: (context, index) {
        return Container(
          margin: EdgeInsets.all(4),
          color: Colors.blue,
          child: Center(
            child: Text(
              'Item ${_data[index]}',
              style: TextStyle(color: Colors.white),
            ),
          ),
        );
      },
    );
  }
}