flutter中的网络请求和下拉刷新上拉加载,toast的案例
添加依赖
pull_to_refresh: ^1.5.6
dio: ^2.1.0
fluttertoast: ^3.0.1
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() {}
}
class Urls {
static const String getUserUrl = '/user/getAllUserByPage';
}
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());
}
}
class BaseNetResponseModel<T> {
final int code;
final String msg;
final T data;
const BaseNetResponseModel(
{this.code,
this.msg,
this.data,
});
}
class DataBean {
String userid;
String job;
DataBean.fromJson(Map<String, dynamic> json) {
userid = json['userid'];
job = json['job'];
}
}
import './databean.dart';
import 'BaseNetResponseModel.dart'; abstract class DataRepository {
Future< BaseNetResponseModel<List<DataBean>>> getUserAll(
String pageIndex,String pageSize
);
}
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);
}
}
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);
}
}
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();
}),
);
}
}
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(),
],
),
);
}
}
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的案例的更多相关文章
- Android 下拉刷新上啦加载SmartRefreshLayout + RecyclerView
在弄android刷新的时候,可算是耗费了一番功夫,最后发觉有现成的控件,并且非常好用,这里记录一下. 原文是 https://blog.csdn.net/huangxin112/article/de ...
- SwipeRefreshLayout实现下拉刷新上滑加载
1. 效果图 2.RefreshLayout.java package myapplication.com.myapplication; import android.content.Context; ...
- 移动端下拉刷新上拉加载-mescroll.js插件
最近无意间看到有这么一个上拉刷新下拉加载的插件 -- mescroll.js,个人感觉挺好用的,官网地址是:http://www.mescroll.com 然后我就看了一下文档,简单的写了一个小dem ...
- 基于SwiperJs的H5/移动端下拉刷新上拉加载更多的效果
最早时,公司的H5项目中曾用过点击一个"加载更多"的DOM元素来实现分页的功能,后来又用过网上有人写的一个上拉加载更多的插件,那个插件是页面将要滚动到底部时就自动请求数据并插入到页 ...
- 基于SwiperJs的H5/移动端下拉刷新上拉加载更多
最早时,公司的H5项目中曾用过点击一个"加载更多"的DOM元素来实现分页的功能,后来又用过网上有人写的一个上拉加载更多的插件,那个插件是页面将要滚动到底部时就自动请求数据并插入到页 ...
- react-native-page-listview使用方法(自定义FlatList/ListView下拉刷新,上拉加载更多,方便的实现分页)
react-native-page-listview 对ListView/FlatList的封装,可以很方便的分页加载网络数据,还支持自定义下拉刷新View和上拉加载更多的View.兼容高版本Flat ...
- [ionic开源项目教程] - 第7讲 实现下拉刷新上拉加载ion-refresher和ion-infinite-scroll
第7讲 实现下拉刷新上拉加载ion-refresher和ion-infinite-scroll 1.将tab1.html的代码改为如下: <ion-content> <ion-ref ...
- react-native 自定义 下拉刷新 / 上拉加载更多 组件
1.封装 Scroller 组件 /** * 下拉刷新/上拉加载更多 组件(Scroller) */ import React, {Component} from 'react'; import { ...
- vue10行代码实现上拉翻页加载更多数据,纯手写js实现下拉刷新上拉翻页不引用任何第三方插件
vue10行代码实现上拉翻页加载更多数据,纯手写js实现下拉刷新上拉翻页不引用任何第三方插件/库 一提到移动端的下拉刷新上拉翻页,你可能就会想到iScroll插件,没错iScroll是一个高性能,资源 ...
随机推荐
- Linux关闭防火墙、设置端口
关闭防火墙 1)重启后生效 开启: chkconfig iptables on 关闭: chkconfig iptables off 验证防火墙是否关闭:chkconfig --list |grep ...
- JS之try..catch...
try 测试代码块的错误. catch 语句处理错误. throw 创建并跑出错误. try { //在这里运行代码 抛出错误 }catch(err){ //在这里处理错误 } 实例: <p&g ...
- 小白怎么用最短时间高效的学习Python?
之所以写这篇文章,在标题里已经表达得很清楚了.做技术的人都知道,时间就是金钱不是一句空话,同一个技术,你比别人早学会半年,那你就能比别人多拿半年的钱.所以有时候别人去培训我也不怎么拦着,为什么?因为培 ...
- 201671030116 宋菲菲 实验十四 团队项目评审&课程学习总结
项目 内容 作业所属课程 所属课程 作业要求 作业要求 课程学习目标 (1)掌握软件项目评审会流程:(2)反思总结课程学习内容 任务一:团队项目审核已完成.项目验收过程意见表已上交. 任务二:课程学习 ...
- 如何防护DDOS攻击策略
DDoS是目前最凶猛.最难防御的网络攻击之一.现实情况是,这个世界级难题还没有完美的.彻底的解决办法,但采取适当的措施以降低攻击带来的影响.减少损失是十分必要的.将DDoS防御作为整体安全策略的重要部 ...
- LINUX系统的常用知识
常用的命令: man config 查看linux里面所有命令的详细描述 man pwd 按回车是一行一行的走,按空格是一页一页的走,按q键是退出的意思 mkdir test 创建文件夹p ...
- char[] byte[] string
C# byte 和 char 可以认为是等价的.但是在文本显示的时候有差异. char 占两个字节,unicode字符 1.内存转换: char转化为byte: public static byte ...
- Hbase表结构
1.Hbase表结构:可以看成map,里面有行键,行键是按照字母顺序排序.行键下面是列族,每个列族可以有不同数量的列甚至是没有列.每个列里面包含着不同时间版本的列的值. 行键:是按照字母的顺序排序的, ...
- IDEA打开项目时,java文件左下角J图标的问题
idea打开项目时,所有的java文件左下角出现J图标,如下图: 说明项目的资源路径配置有问题,打开Project Structure,如下图: 进行资源路径配置,即可解决问题,正确配置如下:
- linux ps命令查看最消耗CPU、内存的进程
1.CPU占用最多的前10个进程: ps auxw|head -1;ps auxw|sort -rn -k3|head -10 2.内存消耗最多的前10个进程 ps auxw|head -1;ps a ...