zoukankan      html  css  js  c++  java
  • Flutter easyrefresh示例 上拉加载+下拉刷新

    官方示例,简单改了下,实现功能为主。

    代码如下:

    import 'dart:async';
    import 'package:flutter/material.dart';
    import 'package:flutter_easyrefresh/easy_refresh.dart';
    
    class BasicPage extends StatefulWidget {
      @override
      _BasicPageState createState() => _BasicPageState();
    }
    
    class _BasicPageState extends State<BasicPage> {
      List<String> addStr = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "0"];
      List<String> str = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "0"];
      GlobalKey<EasyRefreshState> _easyRefreshKey = GlobalKey<EasyRefreshState>();
    
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          appBar: AppBar(
            title: Text("EasyRefresh"),
          ),
          body: Center(
              child: new EasyRefresh(
                key: _easyRefreshKey,
                
                child: new ListView.builder(
                  //ListView的Item
                    itemCount: str.length,
                    itemBuilder: (BuildContext context, int index) {
                      return new Container(
                          height: 70.0,
                          child: Card(
                            child: new Center(
                              child: new Text(
                                str[index],
                                style: new TextStyle(fontSize: 18.0),
                              ),
                            ),
                          ));
                    }),
                onRefresh: () async {
                  await new Future.delayed(const Duration(seconds: 1), () {
                    setState(() {
                      str.clear();
                      str.addAll(addStr);
                    });
                  });
                },
                loadMore: () async {
                  await new Future.delayed(const Duration(seconds: 1), () {
                    if (str.length < 20) {
                      setState(() {
                        str.addAll(addStr);
                      });
                    }
                  });
                },
              )),
          
        );
      }
    }

    特殊效果+底部按钮,代码如下:

    import 'dart:async';
    import 'package:flutter/material.dart';
    import 'package:flutter_easyrefresh/easy_refresh.dart';
    import 'package:flutter_easyrefresh/bezier_circle_header.dart';//如果要使用炫酷的样式需要引入,不同的样式引入不同的文件,详见官方api
    import 'package:flutter_easyrefresh/bezier_bounce_footer.dart';//如果要使用炫酷的样式需要引入,不同的样式引入不同的文件,详见官方api
    
    class BasicPage extends StatefulWidget {
      @override
      _BasicPageState createState() => _BasicPageState();
    }
    
    class _BasicPageState extends State<BasicPage> {
      List<String> addStr = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "0"];
      List<String> str = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "0"];
      GlobalKey<EasyRefreshState> _easyRefreshKey = new GlobalKey<EasyRefreshState>();
      GlobalKey<RefreshHeaderState> _headerKey = new GlobalKey<RefreshHeaderState>();
      GlobalKey<RefreshFooterState> _footerKey = new GlobalKey<RefreshFooterState>();
    
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          appBar: AppBar(
            title: Text("EasyRefresh"),
          ),
          body: Center(
              child: new EasyRefresh(
                key: _easyRefreshKey,
                refreshHeader: BezierCircleHeader(
                  key: _headerKey,
                  color: Theme.of(context).scaffoldBackgroundColor,
                ),
                refreshFooter: BezierBounceFooter(
                  key: _footerKey,
                  color: Theme.of(context).scaffoldBackgroundColor,
                ),
                child: new ListView.builder(
                  //ListView的Item
                    itemCount: str.length,
                    itemBuilder: (BuildContext context, int index) {
                      return new Container(
                          height: 70.0,
                          child: Card(
                            child: new Center(
                              child: new Text(
                                str[index],
                                style: new TextStyle(fontSize: 18.0),
                              ),
                            ),
                          ));
                    }),
                onRefresh: () async {
                  await new Future.delayed(const Duration(seconds: 1), () {
                    setState(() {
                      str.clear();
                      str.addAll(addStr);
                    });
                  });
                },
                loadMore: () async {
                  await new Future.delayed(const Duration(seconds: 1), () {
                    if (str.length < 20) {
                      setState(() {
                        str.addAll(addStr);
                      });
                    }
                  });
                },
              )),
          persistentFooterButtons: <Widget>[
            FlatButton(
                onPressed: () {
                  _easyRefreshKey.currentState.callRefresh();
                },
                child: Text("refresh", style: TextStyle(color: Colors.black))),
            FlatButton(
                onPressed: () {
                  _easyRefreshKey.currentState.callLoadMore();
                },
                child: Text("loadMore", style: TextStyle(color: Colors.black)))
          ], 
        );
      }
    }

    效果图:

  • 相关阅读:
    镜像劫持2
    镜像劫持2
    Windows核心编程 第十七章 -内存映射文件(下)
    Windows核心编程 第十七章 -内存映射文件(下)
    WindowsPE 第五章 导出表编程-1(枚举导出表)
    WindowsPE 第五章 导出表编程-1(枚举导出表)
    PowerShell-2.解决禁止本地执行脚本
    PowerShell-2.解决禁止本地执行脚本
    PowerShell-1.入门及其常用
    CodeForces B. Creating the Contest
  • 原文地址:https://www.cnblogs.com/joe235/p/11649388.html
Copyright © 2011-2022 走看看