我的仪表板代码看起来像这样，这里我在 getReport 方法中执行 get req，我RefreshIndicator在代码中添加了在容器内下拉时应该进行刷新的代码，在那里我正在调用我的 getData()，但我没有得到刷新内容，我在下面添加我的代码，如果我犯了错误，请告诉我。
在我的dashboard.dart下方
class Window extends StatefulWidget {
@override
_WindowState createState() => _WindowState();
}
class _WindowState extends State<Window> {
Future reportList;
@override
void initState() {
super.initState();
reportList = getReport();
}
Future<void> getReport() async {
http.Response response =
await http.get(reportsListURL, headers: {"token": "$token"});
switch (response.statusCode) {
case 200:
String reportList = response.body;
var collection = json.decode(reportList);
return collection;
case 403:
break;
case 401:
return null;
default:
return 1;
}
}
getRefreshScaffold() {
return Center(
child: RaisedButton(
onPressed: () {
setState(() {
reportList = getReport();
});
},
child: Text('Refresh, Network issues.'),
),
);
}
getDashBody(var data) {
double maxHeight = MediaQuery.of(context).size.height;
return Column(
children: <Widget>[
Container(
height: maxHeight - 800,
),
Container(
margin: new EdgeInsets.all(0.0),
height: maxHeight - 188,
child: new Center(
child: new RefreshIndicator( //here I am adding the RefreshIndicator
onRefresh:getReport, //and calling the getReport() which hits the get api
child: createList(context, data),
),),
),
],
);
}
Widget createList(BuildContext context, var data) {
Widget _listView = ListView.builder(
itemCount: data.length,
itemBuilder: (context, count) {
return createData(context, count, data);
},
);
return _listView;
}
createData(BuildContext context, int count, var data) {
var metrics = data["statistic_cards"].map<Widget>((cardInfo) {
var cardColor = getColorFromHexString(cardInfo["color"]);
if (cardInfo["progress_bar"] != null && cardInfo["progress_bar"]) {
return buildRadialProgressBar(
context: context,
progressPercent: cardInfo["percentage"],
color: cardColor,
count: cardInfo["value"],
title: cardInfo["title"],
);
} else {
return buildSubscriberTile(context, cardInfo, cardColor);
}
}).toList();
var rowMetrics = new List<Widget>();
for (int i = 0; i < metrics.length; i += 2) {
if (i + 2 < metrics.length)
rowMetrics.add(Row(children: metrics.sublist(i, i + 2)));
else
rowMetrics.add(Row(children: [metrics[metrics.length - 1], Spacer()]));
}
return SingleChildScrollView(
child: LimitedBox(
// maxHeight: MediaQuery.of(context).size.height / 1.30,
child: Column(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.center,
children: rowMetrics,
),
),
);
}
@override
Widget build(BuildContext context) {
return FutureBuilder(
future: reportList,
builder: (BuildContext context, AsyncSnapshot snapshot) {
switch (snapshot.connectionState) {
case ConnectionState.none:
case ConnectionState.waiting:
case ConnectionState.active:
return Center(
child: CircularProgressIndicator(),
);
case ConnectionState.done:
var data = snapshot.data;
if (snapshot.hasData && !snapshot.hasError) {
return getDashBody(data);
} else if (data == null) {
return Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Text("Timeout! Log back in to continue"),
Padding(
padding: EdgeInsets.all(25.0),
),
RaisedButton(
onPressed: () {
setState(() {
token = null;
});
Navigator.of(context).pushReplacement(
CupertinoPageRoute(
builder: (BuildContext context) => LoginPage()),
);
},
child: Text('Login Again!'),
),
],
),
);
} else {
getRefreshScaffold();
}
}
},
);
}
}
Bak*_*ker 38
下面是一个 StatefulWidget 的 State 类，其中：
ListView被包裹在一个RefreshIndicator
words 状态变量是它的数据源onRefresh调用_pullRefresh函数来更新 ListView
_pullRefresh是一个异步函数，不返回任何内容 (a Future<void>)_pullRefresh的长时间运行的数据请求完成时，words成员/状态变量在setState()调用中更新以重新生成ListView以显示新数据import 'package:english_words/english_words.dart';
class _PullToRefreshPageState extends State<PullToRefreshPage> {
List<WordPair> words = generateWordPairs().take(5).toList();
@override
Widget build(BuildContext context) {
return RefreshIndicator(
onRefresh: _pullRefresh,
child: ListView.builder(
itemCount: words.length,
itemBuilder: (context, index) {
return ListTile(
title: Text(words[index].asPascalCase),
);
},),
);
}
Future<void> _pullRefresh() async {
List<WordPair> freshWords = await WordDataSource().getFutureWords(delay: 2);
setState(() {
words = freshWords;
});
// why use freshWords var? /sf/answers/3709498551/
}
}
class WordDataSource {
Future<List<WordPair>> getFutureWords({int size = 5, int delay = 5}) async {
await Future.delayed(Duration(seconds: delay));
return generateWordPairs().take(5).toList();
}
}
onRefresh功能完成得非常快，您可能想await Future.delayed(Duration(seconds: 2));在它之后添加一个，这样用户体验会更愉快。 这是另一个示例，使用 FutureBuilder，这在从数据库或 HTTP 源获取数据时很常见
class _PullToRefreshFuturePageState extends State<PullToRefreshPage> {
Future<List<WordPair>> futureWords;
@override
void initState() {
super.initState();
futureWords = WordDataSource().getFutureWords(delay: 2);
}
@override
Widget build(BuildContext context) {
return FutureBuilder<List<WordPair>>(
//initialData: [],
future: futureWords,
builder: (context, snapshot) {
return RefreshIndicator(
child: _listView(snapshot),
onRefresh: _pullRefresh,
);
},
);
}
Widget _listView(AsyncSnapshot snapshot) {
if (snapshot.hasData) {
return ListView.builder(
itemCount: snapshot.data.length,
itemBuilder: (context, index) {
return ListTile(
title: Text(snapshot.data[index].asPascalCase),
);
},);
}
else {
return Center(
child: Text('Loading data...'),
);
}
}
Future<void> _pullRefresh() async {
List<WordPair> freshFutureWords = await WordDataSource().getFutureWords(delay: 2);
setState(() {
futureWords = Future.value(freshFutureWords);
});
}
}
getFutureWords()函数与上面的基本示例相同，但数据被包装在 a 中，Future.value()因为 FutureBuilder 需要一个FuturesetState()（futureWords在 FutureBuilder 示例和wordsBasic 示例中）。
async，你会得到一个异常setState并有一个空的setState闭包，可能会导致未来的手拍/代码分析警告不确定期货，但对于刷新指标，您必须返回一个空值，因此使用类似
RefreshIndicator(
onRefresh: () async {
await getData().then((lA) {
if (lA is Future) {
setState(() {
reportList = lA;
});
return;
} else {
setState(() {
//error
});
return;
}
});
return;
},
试试这个，让我知道！
编辑：
好吧，那就试试这个里面的刷新方法
setState(() {
reportList = getReport();
});
return reportList;
| 归档时间： |
|
| 查看次数： |
40655 次 |
| 最近记录： |