flutter列表页面模板:支持下拉刷新、分页加载、加载中、数据为空

import 'package:flutter/material.dart';

class Test1Page extends StatefulWidget {
  @override
  _Test1PageState createState() {
    return _Test1PageState();
  }
}

class _Test1PageState extends State {
  ScrollController _scrollController = ScrollController();
  bool isLoading = true;//是否加载中
  bool isLoadOk = false;//是否加载完成
  var list = List();

  @override
  void initState() {
    super.initState();
    _getData(true); //获取数据
    _scrollController.addListener(() {
      if (_scrollController.position.pixels ==
          _scrollController.position.maxScrollExtent) {
        _getMore(); //加载更多数据
      }
    });
  }

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

  void _getMore() {
    if (isLoading) {
      return;
    } else {
      _getData(false);
    }
  }

  void _getData(bool isRefresh) {//是否刷新
    setState(() {
      isLoading = true;

      //网络成功后
      if (isRefresh) {
        list.clear();
      }
      //添加list数据
      isLoading = false;
      isLoadOk = true;
    });
  }

  Future _refresh() async {
    await _getData(true);
    return;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.red,
        title: Text(
          "标题",
        ),
      ),
      body: RefreshIndicator(
        onRefresh: _refresh,
        child: Container(
            color: Color(0xffefefef),
            width: double.infinity,
            alignment: Alignment.center,
            height: double.infinity,
            child: list.length == 0
                ? (isLoadOk
                ? Text(
              "暂无数据",
              style: TextStyle(color: Color(0xff666666), fontSize: 18),
            )
                : new CircularProgressIndicator(
              strokeWidth: 4.0,
              valueColor: new AlwaysStoppedAnimation(Colors.red),
            ))
                : new ListView.builder(
                itemCount: list.length,
                controller: _scrollController,
                itemBuilder: (BuildContext context, int position) {
                  return Text("");
                })),
      ),
    );
  }
}
 

                            
                        
                    
                    
                    

你可能感兴趣的:(flutter列表页面模板:支持下拉刷新、分页加载、加载中、数据为空)