添加依赖

  pull_to_refresh: ^1.5.6
dio: ^2.1.0
fluttertoast: ^3.0.1
DioUtil
import 'package:dio/dio.dart';

class DioUtil {

  static DioUtil _instance;
final Dio _mDio =
Dio(BaseOptions(baseUrl: "http://192.168.0.60:8080"));
Dio get mDio => _mDio;
DioUtil._();
static DioUtil getInstance() {
if (_instance == null) {
_instance = DioUtil._();
_instance._init();
}
return _instance;
} _init() {}
}
Urls

  class Urls {
static const String getUserUrl = '/user/getAllUserByPage';
}
LogUtils

class LogUtils {
static const bool isRelease = const bool.fromEnvironment("dart.vm.product"); static void d(String tag, Object message) {
if (!isRelease) _printLog(tag, 'D -> ', message);
} static void i(String tag, Object message) {
_printLog(tag, 'I -> ', message);
} static void e(String tag, Object message, {Exception e}) {
_printLog(tag, 'E -> ', message);
} static void _printLog(String tag, String level, Object message) {
StringBuffer sb = new StringBuffer();
sb..write(level)..write(tag ?? '')..write(': ')..write(message);
print(sb.toString());
}
}
BaseNetResponseModel

class BaseNetResponseModel<T> {
final int code; final String msg; final T data; const BaseNetResponseModel(
{this.code,
this.msg,
this.data,
});
}
DataBean
class DataBean {
String userid;
String job; DataBean.fromJson(Map<String, dynamic> json) {
userid = json['userid']; job = json['job'];
}
}
DataRepository

import './databean.dart';
import 'BaseNetResponseModel.dart'; abstract class DataRepository {
Future< BaseNetResponseModel<List<DataBean>>> getUserAll(
String pageIndex,String pageSize
);
}
NetDataRepository
import 'package:dio/dio.dart';
import 'package:futuredemo/BaseNetResponseModel.dart';
import 'package:futuredemo/DataRepository.dart';
import 'package:futuredemo/DioUtil.dart';
import 'package:futuredemo/databean.dart';
import 'Apis.dart'; class NetDataRepository extends DataRepository {
Dio _dio = DioUtil.getInstance().mDio;
List<DataBean> companyCustomerList;
int code;
String msg;
Map<String, dynamic> data;
@override
Future<BaseNetResponseModel<List<DataBean>>> getUserAll(
String pageIndex, String pageSize) async {
Response response = await _dio.get(
Urls.getUserUrl + "?pageIndex=" + pageIndex + "&pageSize=" + pageSize);
print(response.data);
print(response.data['data']);
List userslist = response.data['data']["users"] as List;
code = response.data['code'];
msg = response.data['msg'];
companyCustomerList = userslist.map((customer) {
return DataBean.fromJson(customer);
}).toList(); return BaseNetResponseModel<List<DataBean>>(
code: code, msg: msg, data: companyCustomerList);
}
}
ToastUtils
import 'package:flutter/material.dart';
import 'package:fluttertoast/fluttertoast.dart'; class ToastUtils {
static ToastUtils _instance; ToastUtils._(); static ToastUtils getInstance() {
if (_instance == null) {
_instance = ToastUtils._();
}
return _instance;
} Future _cancelPreToast() async {
await Fluttertoast.cancel();
} static void toastShort(String message) {
getInstance()._cancelPreToast();
Fluttertoast.showToast(
msg: message,
toastLength: Toast.LENGTH_SHORT,
gravity: ToastGravity.CENTER,
timeInSecForIos: 1,
backgroundColor: Colors.grey,
textColor: Colors.white,
fontSize: 14.0);
} static void toastLong(String message) {
getInstance()._cancelPreToast();
Fluttertoast.showToast(
msg: message,
toastLength: Toast.LENGTH_LONG,
gravity: ToastGravity.CENTER,
timeInSecForIos: 1,
backgroundColor: Colors.blue[300],
textColor: Colors.white,
fontSize: 14.0);
}
}
PageError
import 'package:flutter/material.dart';

class PageError extends StatelessWidget {
final VoidCallback callback; const PageError({Key key, this.callback}) : super(key: key); @override
Widget build(BuildContext context) {
return Center(
child: MaterialButton(
child: Text('重新加载', style: TextStyle(color: Theme.of(context).primaryColor),),
onPressed: () {
if (callback != null) callback();
}),
);
}
}
PageLoading
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart'; class PageLoading extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Center(
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
CupertinoActivityIndicator(),
],
),
);
}
}
JobPage
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:futuredemo/log_utils.dart';
import 'package:futuredemo/toast_utils.dart';
import './page_error.dart';
import './page_loading.dart';
import 'package:pull_to_refresh/pull_to_refresh.dart';
import 'BaseNetResponseModel.dart';
import 'NetDataRepository.dart';
import 'databean.dart'; class JobPage extends StatefulWidget {
@override
_JobPageState createState() => _JobPageState();
} class _JobPageState extends State<JobPage> {
NetDataRepository _netDataRepository = NetDataRepository(); Future<Map<String, dynamic>> _futureBuilderFuture;
List<DataBean> dataList = List(); RefreshController _refreshController =
RefreshController(initialRefresh: false); void initState() {
super.initState(); _futureBuilderFuture = _loadData();
} void _onRefresh() async {
BaseNetResponseModel<List<DataBean>> model =
await _netDataRepository.getUserAll("1", "10");
dataList.clear();
dataList.addAll(model.data);
// 日志打印
LogUtils.d("tag", model.code);
_refreshController.refreshCompleted();
_refreshController.loadComplete();
if (mounted) setState(() {});
} void _onLoading() async {
await Future.delayed(Duration(milliseconds: 1000));
if (dataList.length < 30) {
dataList.add(dataList[0]);
} else {
_refreshController.loadNoData();
return;
} if (mounted) setState(() {}); _refreshController.loadComplete();
} Future<Map<String, dynamic>> _loadData() async {
BaseNetResponseModel<List<DataBean>> model =
await _netDataRepository.getUserAll("1", "10");
dataList.clear();
dataList.addAll(model.data);
return {"data": 0};
} _refresh() async {
setState(() {
_futureBuilderFuture = _loadData();
});
} @override
Widget build(BuildContext context) {
return Scaffold( appBar: AppBar(
elevation: 0.0,
title: Text('职业'),
centerTitle: true,
),
floatingActionButton: FloatingActionButton(
backgroundColor: Theme.of(context).primaryColor,
child: Icon(
Icons.add,
size: 28,
color: Colors.white,
),
elevation: 4,
onPressed: () {
//吐司提示
ToastUtils.toastShort("点击了");
}),
body: FutureBuilder(
builder: (BuildContext context,
AsyncSnapshot<Map<String, dynamic>> snapshot) {
Widget widget;
switch (snapshot.connectionState) {
case ConnectionState.none:
widget = Container();
break;
case ConnectionState.active:
case ConnectionState.waiting:
widget = PageLoading();
break;
case ConnectionState.done:
if (snapshot.hasError) {
widget = PageError(
callback: _refresh,
);
} else if (snapshot.hasData) {
widget = _buildBody(context);
}
break;
}
return widget;
},
future: _futureBuilderFuture,
),
);
} Column _buildBody(BuildContext context) {
return Column(
children: <Widget>[
Expanded(
child: SmartRefresher(
enablePullDown: true,
enablePullUp: true,
header: WaterDropMaterialHeader(
// backgroundColor:Color(OxFF00),
),
footer: CustomFooter(
builder: (BuildContext context, LoadStatus mode) {
Widget body;
if (mode == LoadStatus.idle) {
body = Row(children: <Widget>[
Expanded(
flex: 3,
child: Divider(
indent: 40,
height: 1,
),
),
Expanded(
flex: 2,
child: Container(
height: 40.0,
child: Center(
child: Text("上拉加载更多",
style: TextStyle(
color: Colors.grey, fontSize: 13))),
),
),
Expanded(
flex: 3,
child: Divider(
height: 1,
endIndent: 40,
),
)
]);
} else if (mode == LoadStatus.loading) {
body = CupertinoActivityIndicator();
} else if (mode == LoadStatus.failed) {
body = Text("加载失败!",
style: TextStyle(color: Colors.grey, fontSize: 13));
} else {
body = Row(children: <Widget>[
Expanded(
flex: 3,
child: Divider(
indent: 40,
height: 1,
),
),
Expanded(
flex: 2,
child: Container(
height: 40.0,
child: Center(
child: Text("已经到底啦",
style: TextStyle(
color: Colors.grey, fontSize: 13))),
),
),
Expanded(
flex: 3,
child: Divider(
height: 1,
endIndent: 40,
),
)
]);
}
return Container(
height: 50.0,
child: Center(child: body),
);
},
),
controller: _refreshController,
onRefresh: _onRefresh,
onLoading: _onLoading,
child: GridView.builder(
padding: EdgeInsets.all(10.0),
shrinkWrap: true,
itemCount: dataList.length,
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 2,
//纵轴间距
mainAxisSpacing: 10.0,
//横轴间距
crossAxisSpacing: 10.0,
//子组件宽高长度比例
childAspectRatio: 1.5),
itemBuilder: (context, index) {
// Map<String, dynamic> entry = dataList[index];
return UserItemWidget(
title: '${dataList[index].job}',
onTap: () {},
);
}),
),
),
],
);
}
} class UserItemWidget extends StatefulWidget {
String title = ""; int type = 1;
VoidCallback onTap; UserItemWidget({
Key key,
this.title,
this.onTap,
}) : super(key: key); @override
_UserItemWidgetState createState() => _UserItemWidgetState();
} class _UserItemWidgetState extends State<UserItemWidget> {
VoidCallback _onTap; @override
void initState() {
super.initState();
_onTap = widget.onTap;
} @override
Widget build(BuildContext context) {
return InkWell(
onTap: _onTap,
child: Stack(
children: <Widget>[
Container(
padding: EdgeInsets.all(8),
decoration: new BoxDecoration(
color: Colors.white,
border: new Border.all(width: 1.0, color: Colors.grey[300]),
borderRadius: new BorderRadius.all(new Radius.circular(2)),
),
child: Column(
mainAxisSize: MainAxisSize.max,
children: <Widget>[
Container(
margin: EdgeInsets.only(top: 15, bottom: 10, left: 10),
alignment: Alignment.centerLeft,
child: Text(widget.title == "" ? "未知" : widget.title,
style: TextStyle(fontSize: 18)),
),
],
),
),
Positioned(
top: 0,
right: 0,
child: Container(
color: getTypeColor(widget.type),
padding: EdgeInsets.all(5),
child: Center(
child: Text(getTypeText(widget.type),
style: TextStyle(
color: Colors.white,
fontSize: 13.0,
)),
),
))
],
),
);
} String getTypeText(int type) {
switch (type) {
case 1:
return "黄金职业";
case 2:
return "夕阳职业";
case 3:
return "朝阳职业";
}
} Color getTypeColor(int type) {
switch (type) {
case 1:
return Color(0xFFFF00FF);
case 2:
return Color(0xFFC6C6C6);
case 3:
return Color(0xFF7FC3FD);
}
}
}

效果:

flutter中的网络请求和下拉刷新上拉加载,toast的案例的更多相关文章

  1. Android 下拉刷新上啦加载SmartRefreshLayout + RecyclerView

    在弄android刷新的时候,可算是耗费了一番功夫,最后发觉有现成的控件,并且非常好用,这里记录一下. 原文是 https://blog.csdn.net/huangxin112/article/de ...

  2. SwipeRefreshLayout实现下拉刷新上滑加载

    1. 效果图 2.RefreshLayout.java package myapplication.com.myapplication; import android.content.Context; ...

  3. 移动端下拉刷新上拉加载-mescroll.js插件

    最近无意间看到有这么一个上拉刷新下拉加载的插件 -- mescroll.js,个人感觉挺好用的,官网地址是:http://www.mescroll.com 然后我就看了一下文档,简单的写了一个小dem ...

  4. 基于SwiperJs的H5/移动端下拉刷新上拉加载更多的效果

    最早时,公司的H5项目中曾用过点击一个"加载更多"的DOM元素来实现分页的功能,后来又用过网上有人写的一个上拉加载更多的插件,那个插件是页面将要滚动到底部时就自动请求数据并插入到页 ...

  5. 基于SwiperJs的H5/移动端下拉刷新上拉加载更多

    最早时,公司的H5项目中曾用过点击一个"加载更多"的DOM元素来实现分页的功能,后来又用过网上有人写的一个上拉加载更多的插件,那个插件是页面将要滚动到底部时就自动请求数据并插入到页 ...

  6. react-native-page-listview使用方法(自定义FlatList/ListView下拉刷新,上拉加载更多,方便的实现分页)

    react-native-page-listview 对ListView/FlatList的封装,可以很方便的分页加载网络数据,还支持自定义下拉刷新View和上拉加载更多的View.兼容高版本Flat ...

  7. [ionic开源项目教程] - 第7讲 实现下拉刷新上拉加载ion-refresher和ion-infinite-scroll

    第7讲 实现下拉刷新上拉加载ion-refresher和ion-infinite-scroll 1.将tab1.html的代码改为如下: <ion-content> <ion-ref ...

  8. react-native 自定义 下拉刷新 / 上拉加载更多 组件

    1.封装 Scroller 组件 /** * 下拉刷新/上拉加载更多 组件(Scroller) */ import React, {Component} from 'react'; import { ...

  9. vue10行代码实现上拉翻页加载更多数据,纯手写js实现下拉刷新上拉翻页不引用任何第三方插件

    vue10行代码实现上拉翻页加载更多数据,纯手写js实现下拉刷新上拉翻页不引用任何第三方插件/库 一提到移动端的下拉刷新上拉翻页,你可能就会想到iScroll插件,没错iScroll是一个高性能,资源 ...

随机推荐

  1. keras模块学习之model层【重点学习】

    本笔记由博客园-圆柱模板 博主整理笔记发布,转载需注明,谢谢合作! model层是keras模块最重要的一个层,所以单独做下笔记,这块比较难理解,本博主自己还在学习这块,还在迷糊中. model的方法 ...

  2. 六.Protobuf3引入其他.proto文件

    Protobuf3 使用其他消息类型 您可以使用其他消息类型作为字段类型.例如,假设您希望在每个SearchResponse消息中包含Result消息,为此,您可以在.proto中定义结果消息类型,然 ...

  3. 项目读取数据,一直出现 Closing connections idle longer than 30 SECONDS,卡死现象

    项目读取数据,一直出现 Closing connections idle longer than 30 SECONDS,卡死现象. 我的是在读取oracle数据的时候出现这种错误. 可以参考这篇文章 ...

  4. webpack打包绝对路径引用资源和element ui字体图标不显示的解决办法

    webpack打包绝对路径引用资源解决办法: 打开webpack.prod.conf.js 找到output:增加 publicPath: './',  即可,如图  element ui字体图标不显 ...

  5. YAML_12 批量创建用户,分别设置用户组

    with_items标准循环 ansible]# vim add.yml --- - hosts: web2   remote_user: root   tasks:     - user:     ...

  6. YAML_01 YAML语法和playbook写法

    ansible的playbook采用yaml语法,它简单地实现了json格式的事件描述.yaml之于json就像markdown之于html一样,极度简化了json的书写.在学习ansible pla ...

  7. VS - Microsoft.Practices.Unity

    PM>  Install-Package Unity Web.config <configSections> <section name="unity" t ...

  8. 历史相关API

    一.history对象 ①history.back()移动到上一个访问页面,等同于浏览器的后退键. ②history.forward()动到下一个访问页面,等同于浏览器的前进键. ③history.g ...

  9. RookeyFrame 自定义数据源 返回统计查询后的视图

    核心:对返回的数据进行重写 功能是这样的:上传淘宝后台的订单文件,将订单文件里面的数据导入到系统,对导入后的订单数据进行统计后再显示. Order_File:用来存上传的订单文件,格式是****.cs ...

  10. web表单

    1.配置 使用Flask-WTF, 它集成了WTForms并且完美地集成到了flask. 在microblog根目录下创建一个文件,存储flask扩展的所有配置,CSRF_ENABLED用于激活跨站点 ...