Flutter 项目实战 下拉刷新、上拉加载 九

在Flutter中，下拉刷新和上拉加载更多通常使用RefreshIndicator和ListView配合使用。以下是一个简单的示例代码：

import 'package:flutter/material.dart';
 
void main() => runApp(MyApp());
 
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: RefreshIndicatorPage(),
    );
  }
}
 
class RefreshIndicatorPage extends StatefulWidget {
  @override
  _RefreshIndicatorPageState createState() => _RefreshIndicatorPageState();
}
 
class _RefreshIndicatorPageState extends State<RefreshIndicatorPage> {
  List<String> items = List<String>.generate(20, (i) => 'Item ${i + 1}');
 
  Future<void> _refresh() async {
    await Future.delayed(Duration(seconds: 2));
    setState(() {
      items = List<String>.generate(20, (i) => 'Item ${i + 1}').toList();
    });
  }
 
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('下拉刷新和上拉加载示例'),
      ),
      body: RefreshIndicator(
        onRefresh: _refresh,
        child: ListView.builder(
          itemCount: items.length,
          itemBuilder: (context, index) {
            return ListTile(
              title: Text(items[index]),
            );
          },
        ),
      ),
    );
  }
}

在这个示例中，RefreshIndicator包裹了ListView.builder，它会在用户下拉时触发onRefresh回调，执行刷新操作。而ListView.builder则是用来高效构建一个可滚动的列表视图，它会在需要时创建新的列表项。

这个例子提供了一个简单的下拉刷新机制，并且可以通过滚动到列表底部来触发加载更多的操作，但是没有实现实际的加载更多逻辑。在实际应用中，你可能需要追踪当前列表的状态，并在用户滚动到列表底部时加载更多数据。