//连接到一个活跃的操作,比如stream流,会不断地返回值,并还没有结束,一般也是可以加载个菊花
active,
//异步操作执行结束,一般在这里可以去拿取异步操作执行的结果,并显示相应的布局
done,
}
下面的官方的例子。
FutureBuilder(
future: _calculation, // a previously-obtained Future or null
builder: (BuildContext context, AsyncSnapshot snapshot) {
switch (snapshot.connectionState) {
case ConnectionState.none:
return Text(‘Press button to start.’);
case ConnectionState.active:
case ConnectionState.waiting:
return Text(‘Awaiting result…’);
case ConnectionState.done:
if (snapshot.hasError)
return Text(‘Error: ${snapshot.error}’);
return Text(‘Result: ${snapshot.data}’);
}
return null; // unreachable
},
)
3.实现思路,布局方式
-
网络请求:利用Dio库来请求玩Android的知识体系列表,api:www.wanandroid.com/tree/json
-
序列化json:利用json_serializable来解析返回的json数据
-
布局:加载过程显示CircularProgressIndicator,加载完成把数据显示到ListView中, 加载为空或者加载出错的话,显示相应的提示页面,并可以进行重试请求 一般。我们的列表页面都是有下拉刷新的功能,所以这里就用RefreshIndicator来实现。
4.代码实现
import ‘package:flutter/material.dart’;
import ‘package:dio/dio.dart’;
import ‘entity.dart’;
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: ‘Flutter Demo’,
theme: ThemeData(
// This is the theme of your application.
//
// Try running your application with “flutter run”. You’ll see the
// application has a blue toolbar. Then, without quitting the app, try
// changing the primarySwatch below to Colors.green and then invoke
// “hot reload” (press “r” in the console where you ran “flutter run”,
// or simply save your changes to “hot reload” in a Flutter IDE).
// Notice that the counter didn’t reset back to zero; the application
// is not restarted.
primarySwatch: Colors.blue,
),
home: FutureBuilderPage(),
);
}
}
class FutureBuilderPage extends StatefulWidget {
@override
_FutureBuilderPageState createState() => _FutureBuilderPageState();
}
class _FutureBuilderPageState extends State {
Future future;
@override
void initState() {
// TODO: implement initState
super.initState();
future = getdata();
}
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(
title: new Text(“知识体系”),
actions: [
new IconButton(
icon: Icon(
Icons.search,
color: Colors.white,
),
onPressed: null)
],
),
body: buildFutureBuilder(),
floatingActionButton: new FloatingActionButton(onPressed: () {
setState(() {
//测试futurebuilder是否进行没必要的重绘操作
});
}),
);
}
FutureBuilder<List> buildFutureBuilder() {
return new FutureBuilder<List>(
builder: (context, AsyncSnapshot<List> async) {
//在这里根据快照的状态,返回相应的widget
if (async.connectionState == ConnectionState.active ||
async.connectionState == ConnectionState.waiting) {
return new Center(
child: new CircularProgressIndicator(),
);
}
if (async.connectionState == ConnectionState.done) {
debugPrint(“done”);
if (async.hasError) {
return new Center(
child: new Text(“ERROR”),
);
} else if (async.hasData) {
List list = async.data;
return new RefreshIndicator(
child: buildListView(context, list),
onRefresh: refresh);
}
最后
想要了解更多关于大厂面试的同学可以点赞支持一下,除此之外,我也分享一些优质资源,包括:Android学习PDF+架构视频+源码笔记,高级架构技术进阶脑图、Android开发面试专题资料,高级进阶架构资料 这几块的内容。非常适合近期有面试和想在技术道路上继续精进的朋友。