Flutter圈子FlutterFlutter中文社区

Flutter中ScrollView及其子类(ListView等

2018-04-23  本文已影响197人  Brant白叔

先丢一个github的demo代码地址
移动开发发展到现在,下拉刷新是个必不可少的功能了。

Flutter里面的ScrollView及其子view都可以添加下拉刷新功能,只要在view的上层再包裹一层RefreshIndicator,这个下拉刷新是MD风格的。

几个要注意的点(以ListView为例)

声明一个key来保存控件

final GlobalKey<RefreshIndicatorState> _refreshIndicatorKey = new GlobalKey<
      RefreshIndicatorState>();
body: new RefreshIndicator(
        key: _refreshIndicatorKey,
        onRefresh: _getData, // onRefresh 参数是一个 Future<Null> 的回调
        child: new ListView.builder(
          // 这句是在list里面的内容不足一屏时,list可能会滑不动,加上就一直都可以滑动
          physics: const AlwaysScrollableScrollPhysics(),
          itemCount: this.list.length,
          itemBuilder: (_, int index) => _createItem(list[index]),
        ),
      ),
Future<Null> _getData() {
    final Completer<Null> completer = new Completer<Null>();

    // 启动一下 [Timer] 在3秒后,在list里面添加一条数据,关完成这个刷新
    new Timer(Duration(seconds: 3), () {
      // 添加数据,更新界面
      setState(() {
        list.add("新加数据${list.length}");
      });

      // 完成刷新
      completer.complete(null);
    });

    return completer.future;
  }

关于学习

flutter的学习文章都整理在这个github仓库

上一篇下一篇

猜你喜欢

热点阅读