Я хочу получить массив данных json, вложенный в интерфейс пользователя во флаттере. У меня есть моя модель и пользовательский интерфейс, но я не понимаю, пожалуйста, посоветуйте и исправьте мой код для реализации в пользовательском интерфейсе.
это моя модель
import 'dart:convert';
import 'package:http/http.dart' as http;
MutasiRekResponse myModelFromJson(String str) => MutasiRekResponse.fromJson(json.decode(str));
String myModelToJson(MutasiRekResponse data) => json.encode(data.toJson());
class MutasiRekResponse {
String responseCode;
String responseMessage;
String date;
String time;
String accNumber;
String startDate;
String endDate;
List<Content> content;
MutasiRekResponse({
this.responseCode,
this.responseMessage,
this.date,
this.time,
this.accNumber,
this.startDate,
this.endDate,
this.content,
});
factory MutasiRekResponse.fromJson(Map<String, dynamic> json) => MutasiRekResponse(
responseCode: json["responseCode"],
responseMessage: json["responseMessage"],
date: json["date"],
time: json["time"],
accNumber: json['accNumber'],
content: List<Content>.from(json["content"].map((x) => Content.fromJson(x))),
);
Map<String, dynamic> toJson() => {
"responseCode": responseCode,
"responseMessage": responseMessage,
"date": date,
"time": time,
"accNumber": accNumber,
"content": List<dynamic>.from(content.map((x) => x.toJson())),
};
}
class Content {
String postingDate;
String valueDate;
String inputDate;
String inputTime;
String desc;
String noReff;
String amount;
String balance;
Content({
this.postingDate,
this.valueDate,
this.inputDate,
this.inputTime,
this.desc,
this.noReff,
this.amount,
this.balance,
});
factory Content.fromJson(Map<String, dynamic> json) => Content(
postingDate: json["postingDate"],
valueDate: json["valueDate"],
inputDate: json["inputDate"],
inputTime: json["inputTime"],
desc: json["desc"],
noReff: json["noReff"],
amount: json["amount"],
balance: json["balance"],
);
Map<String, dynamic> toJson() => {
"postingDate": postingDate,
"valueDate": valueDate,
"inputDate": inputDate,
"inputTime": inputTime,
"desc": desc,
"noReff": noReff,
"amount": amount,
"balance": balance,
};
static Future<MutasiRekResponse> getMutasiDetails(String accNumber, String startDate, String endDate) async {
String apiURL ="urlAPI";
String username = "username";
String password = "password";
var bytes = utf8.encode("$username:$password");
var credentials = base64.encode(bytes);
var headers = {
"Content-Type": "application/json",
"Authorization": "Basic $credentials"
};
var params = Map<String, dynamic>();
params['accNumber'] = accNumber;
params['startDate'] = startDate;
params['endDate'] = endDate;
http.Response apiResult =
await http.post(apiURL, body: params, headers: headers);
if (apiResult.statusCode == 200) {
return MutasiRekResponse.fromJson(json.decode(apiResult.body));
} else {
throw Exception('failed to load data');
}
}
}
этот интерфейс пользовательского интерфейса
import 'package:myfolder/models/riwayatTrx_mdl.dart';
import 'package:flutter/material.dart';
class RiwayatTransaksi extends StatefulWidget {
@override
RiwayatTransaksiState createState() => RiwayatTransaksiState();
}
class RiwayatTransaksiState extends State<RiwayatTransaksi> {
RiwayatTrxResult riwayatTrxResult;
@override
void initState() {
RiwayatTrxResult.connectToAPI("0002100000291", "", "").then((value) {
riwayatTrxResult = value;
setState(() {});
});
super.initState();
}
Widget build(BuildContext context) {
return new SafeArea(
child: new Scaffold(
backgroundColor: Color(0xFFF4F4F4),
appBar: AppBar(
title: const Text('Riwayat'),
),
body: Container(
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
Padding(
padding:
const EdgeInsets.symmetric(vertical: 20.0, horizontal: 16.0),
child: Text(
'Riwayat Transaksi',
style: TextStyle(fontWeight: FontWeight.w700, fontSize: 20.0),
),
),
_historyWidget(riwayatTrxResult),
],
),
),
),
);
}
//HOW I DO CALL METHOD FOR LOOP
Widget _historyWidget(RiwayatTrxResult riwayatTrxResult) {
return Container(
height: 100.0,
margin: EdgeInsets.only(bottom: 16.0, left: 16.0, right: 16.0),
child: Card(
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 16.0),
child: Row(
children: <Widget>[
],
),
),
)
);
}
}
API JSON Ответ
{
"responseCode": "0000",
"responseMessage": "Success",
"date": "20200302",
"time": "170248",
"branchCode": "0000",
"branchName": "BRANCH ONE",
"accNumber": "0002100000291",
"name": "MYNAME",
"address": "jl wr supratman",
"city": "Kab Kota Lainnya Bali",
"postalCode": "10110",
"totalTrx": "5",
"content": [
{
"postingDate": "20191203",
"valueDate": "20191203",
"inputDate": "20191203",
"inputTime": "214808",
"desc": "BUNGA DEPOSITO JATUH TEMPO",
"noReff": "B2100000000026",
"amount": "+20712,33",
"balance": "+6971357445,15"
},
{
"postingDate": "20191203",
"valueDate": "20191203",
"inputDate": "20191203",
"inputTime": "214809",
"desc": "BUNGA DEPOSITO JATUH TEMPO",
"noReff": "B2100000000033",
"amount": "+13808,22",
"balance": "+6971371253,37"
},
]
}
как вызывать метод и обрабатывать извлечение данных в пользовательском интерфейсе, но я не понимаю, пожалуйста, совет и исправьте мой код для реализации в пользовательском интерфейсе.