/**
 * 下拉刷新組件
 *const RefreshIndicator
    ({
    Key key,
    @required this.child,
    this.displacement: 40.0, //觸發下拉刷新的距離
    @required this.onRefresh, //下拉回調方法,方法需要有async和await關鍵字，沒有await，刷新圖標立馬消失，沒有async，刷新圖標不會消失
    this.color, //進度指示器前景色 默認為系統主題色
    this.backgroundColor, //背景色
    this.notificationPredicate: defaultScrollNotificationPredicate,
    })
 */

class Widget_RefreshIndicator_State extends State<Widget_RefreshIndicator_Page> {
  var list = [];
  int page = 0;
  bool isLoading = false;//是否正在請求新數據
  bool showMore = false;//是否顯示底部加載中提示
  bool offState = false;//是否顯示進入頁面時的圓形進度條

  ScrollController scrollController = ScrollController();

  @override
  void initState() {
    super.initState();
    scrollController.addListener(() {
      if (scrollController.position.pixels ==
          scrollController.position.maxScrollExtent) {
        print('滑動到了最底部${scrollController.position.pixels}');
        setState(() {
          showMore = true;
        });
        getMoreData();
      }
    });
    getListData();
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
          appBar: AppBar(
            title: Text("RefreshIndicator"),
          ),
          body: Stack(
            children: <Widget>[
              RefreshIndicator(
                child: ListView.builder(
                  controller: scrollController,
                  itemCount: list.length + 1,//列表長度+底部加載中提示
                  itemBuilder: choiceItemWidget,
                ),
                onRefresh: _onRefresh,
              ),
              Offstage(
                offstage: offState,
                child: Center(
                  child: CircularProgressIndicator(),
                ),
              ),
            ],
          )
      ),
    );
  }

  @override
  void dispose() {
    super.dispose();
    //手動停止滑動監聽
    scrollController.dispose();
  }

  /**
   * 加載哪個子組件
   */
  Widget choiceItemWidget(BuildContext context, int position) {
    if (position < list.length) {
      return HomeListItem(position, list[position], (position) {
        debugPrint("點擊了第$position條");
      });
    } else if (showMore) {
      return showMoreLoadingWidget();
    }else{
      return null;
    }
  }

  /**
   * 加載更多提示組件
   */
  Widget showMoreLoadingWidget() {
    return Container(
      height: 50.0,
      child: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        crossAxisAlignment: CrossAxisAlignment.center,
        children: <Widget>[
          Text('加載中...', style: TextStyle(fontSize: 16.0),),
        ],
      ),
    );
  }

  /**
   * 模擬進入頁面獲取數據
   */
  void getListData() async {
    if (isLoading) {
      return;
    }
    setState(() {
      isLoading = true;
    });
    await Future.delayed(Duration(seconds: 3), () {
      setState(() {
        isLoading = false;
        offState = true;
        list = List.generate(20, (i) {
          return ItemInfo("ListView的一行數據$i");
        });
      });
    });
  }

  /**
   * 模擬到底部加載更多數據
   */
  void getMoreData() async {
    if (isLoading) {
      return;
    }
    setState(() {
      isLoading = true;
      page++;
    });
    print('上拉刷新開始,page = $page');
    await Future.delayed(Duration(seconds: 3), () {
      setState(() {
        isLoading = false;
        showMore = false;
        list.addAll(List.generate(3, (i) {
          return ItemInfo("上拉添加ListView的一行數據$i");
        }));
        print('上拉刷新結束,page = $page');
      });
    });
  }

  /**
   * 模擬下拉刷新
   */
  Future < void > _onRefresh() async {
    if (isLoading) {
      return;
    }
    setState(() {
      isLoading = true;
      page = 0;
    });

    print('下拉刷新開始,page = $page');

    await Future.delayed(Duration(seconds: 3), () {
      setState(() {
        isLoading = false;

        List tempList = List.generate(3, (i) {
          return ItemInfo("下拉添加ListView的一行數據$i");
        });
        tempList.addAll(list);
        list = tempList;
        print('下拉刷新結束,page = $page');
      });
    });
  }
}

碼云地址：https://gitee.com/xgljh/Flutter.git