android - 将单个 API 响应转换为地图列表以在颤动中转换为卡片
问题描述
我已经使用颤振食谱创建了一个未来,以便将单个地图转换为一张卡片。但是我想用地图列表来做到这一点。我知道我需要创建一个列表,然后使用 futurebuilder 返回一个列表视图,但我不确定如何添加到 apitest() 方法以将每个 Map 添加到列表中然后进行转换。任何帮助深表感谢。
这是 main.dart:
import 'package:flutter/material.dart';
import './viewviews.dart';
void main() => runApp(new MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return new MaterialApp(
title: 'API TEST',
theme: new ThemeData(
primarySwatch: Colors.purple,
backgroundColor: Colors.black,
),
home: CardPage(),
);
}
}
这是我构造对象的类:
import 'package:flutter/material.dart';
class Post {
final String appName;
final String brandName;
final int views;
Post(
{@required this.appName, @required this.brandName, @required this.views});
factory Post.fromJson(Map<String, dynamic> json) {
return (Post(
views: json['Views'],
brandName: json['brandname'],
appName: json['appname']));
}
}
最后是我用来进行 api 调用和使用 futurebuilder 的代码:
import 'dart:async';
//final List<Post> cardslist = [];
class CardPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
// TODO: implement build
return Scaffold(
appBar: AppBar(title: Text('API TEST')),
body: ListView.builder(
itemBuilder: cardbuilder,
itemCount: 1,
));
}
}
Future<Post> testapi() async {
final apiresponse =
await http.get('https://myriadapp-55adf.firebaseio.com/Views.json');
print(apiresponse.body);
return Post.fromJson(json.decode(apiresponse.body));
}
Widget cardbuilder(BuildContext context, int index) {
return Container(
margin: EdgeInsets.all(20.0),
child: FutureBuilder<Post>(
future: testapi(),
builder: (context, snapshot) {
if (snapshot.hasData) {
return Text(snapshot.data.appName);
} else if (snapshot.hasError) {
return Text(snapshot.hasError.toString());
}
return Center(child: CircularProgressIndicator());
}));
}
我已经注释掉了创建列表的代码,但我知道我需要这个,我只需要解码 json 以向其中添加地图列表,然后使用 Futurebuilder 返回列表视图。谢谢你。
解决方案
你的 json 实际上并没有返回一个 json 数组,它实际上返回了一个带有任意键名的映射,比如View1
,所以我们将迭代那个映射。您需要提升FutureBuilder
到可以一次处理整个 json 的程度,因此在页面级别。所以CardPage
变成
class CardPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('API TEST')),
body: FutureBuilder<Map>(
future: fetchData(),
builder: (context, snapshot) {
if (snapshot.hasData) {
final Map<String, dynamic> data = snapshot.data;
final List<Container> cards = data.keys
.map((String s) => makeCard(Post.fromJson(data[s])))
.toList();
return ListView(
children: cards,
);
} else if (snapshot.hasError) {
return Text(snapshot.hasError.toString());
}
return const Center(
child: CircularProgressIndicator(),
);
},
),
);
}
Container makeCard(Post post) {
return Container(
margin: EdgeInsets.all(20.0),
child: Text(post.appName),
);
}
Future<Map> fetchData() async {
final apiresponse =
await http.get('https://myriadapp-55adf.firebaseio.com/Views.json');
print(apiresponse.body);
return json.decode(apiresponse.body);
}
}
推荐阅读
- cython - 在 Cython 中声明一个可变长度的元组
- python - 更改 Seaborn 配对图的字体大小
- python-3.x - 获取给定图像位置的 numpy 索引
- r - R Shiny dateInput在NA默认和最小允许日期时不遵守最大允许日期
- ios - 如何通过在同一行中加载单元格来修复 tableview?
- python - 中序遍历中带有堆栈的while语句
- python - 如何将numpy数组转换为向量
& (参考)与 SWIG - javascript - 为什么将 JSONObject 放入 indexedDB 数据库时会出错?
- swift - UISearchController 中的取消按钮在 IOS 13 中没有正确消失
- kubernetes - kubernetes Autoscaler - 无法获取 loadbalancing.googleapis.com|https|request_count