JSONから取得してきたデータに、別のJSONから取得してきたデータを
追加したいのですが、やり方が分かりません。
お分かりになる方、是非ともご教示頂けますと幸いで御座います。宜しくお願い致します。
■詳細
最終的に、動物リストを作りたいのですが、
取得したJSONデータでは、動物の「type」情報が不足しております。
(哺乳類とか鳥類とか霊長類とか)
ですので、別のJSONデータからその足りないタイプ情報を追加して、
以下のようなデータにしてリスト上に表示したいです。
■完成したいリストデータ
Dart
1 2[ 3{id: 1, name: ネコ, food: 魚, type: 哺乳類}, 4{id: 2, name: アヒル, food: 虫, type: 鳥類}, 5{id: 3, name: サル, food:果物, type: 霊長類} 6] 7
■animaru.json
※ベースのJSONデータ(typeのデータが足りない)
JSON
1{ 2 "count": 3, 3 "address": "sword", 4 "main": null, 5 "sword_data": [ 6 { 7 "id": "1", 8 "name": "ネコ", 9 "food": "魚" 10 }, 11 { 12 "id": "2", 13 "name": "アヒル", 14 "food": "虫" 15 }, 16 { 17 "id": "3", 18 "name": "サル", 19 "food": "果物" 20 } 21 ] 22}
■animaru_type.json
※追加用のJSONデータ(typeデータが欲しい)
JSON
1{ 2 "count": 4, 3 "address": "sword", 4 "main": null, 5 "sword_data": [ 6 { 7 "type": "鳥類", 8 "name": "アヒル" 9 }, 10 { 11 "type": "哺乳類", 12 "name": "ねこ" 13 }, 14 { 15 "type": "両性類", 16 "name": "カエル" 17 }, 18 { 19 "type": "霊長類", 20 "name": "サル" 21 } 22 ] 23}
■main.dart
Dart
1 2import 'package:flutter/material.dart'; 3import 'package:jsontest/json.dart'; 4 5void main() => runApp(MyApp()); 6 7class MyApp extends StatelessWidget { 8 // This widget is the root of your application. 9 10 Widget build(BuildContext context) { 11 return MaterialApp( 12 title: 'アニマルリスト', 13 theme: ThemeData( 14 primarySwatch: Colors.blue, 15 ), 16 home: LoadJsonPage(), 17 ); 18 } 19} 20
■load_json.dart
Dart
1 2import 'package:flutter/material.dart'; 3import 'package:flutter/services.dart'; 4import 'dart:async'; 5import 'package:flutter/services.dart' show rootBundle; 6import 'dart:convert'; 7 8class LoadJsonPage extends StatefulWidget { 9 10 _LoadJsonPageState createState() => _LoadJsonPageState(); 11 12} 13 14class _LoadJsonPageState extends State<LoadJsonPage> { 15 16 17 //一番最初に処理する 18 void initState() { 19 super.initState(); 20 // ローカルJSONをロード 21 this.loadLocalJson(); 22 this.loadLocalJson2(); 23 } 24 25 List _animaruData; //アニマルデータ 26 List _animaruTypeData; //アニマル種類データ 27 28 // ローカルJSONをロード 29 Future loadLocalJson() async { 30 //ここでJSONデータを取得 31 String jsonString = await rootBundle.loadString('assets/json/animaru.json'); 32 setState(() { 33 //ここで変換 34 final jsonResponse = json.decode(jsonString); 35 print("デコードした値は:" + jsonResponse.toString()); 36 _animaruData = jsonResponse['sword_data']; 37 }); 38 } 39 40 Future loadLocalJson2() async { 41 //ここでJSONデータを取得 42 String jsonString = await rootBundle.loadString('assets/json/animaru_type.json'); 43 setState(() { 44 //ここで変換 45 final jsonResponse = json.decode(jsonString); 46 print("デコードした値は:" + jsonResponse.toString()); 47 _animaruTypeData = jsonResponse['sword_data']; 48 }); 49 } 50 51 52 53 Widget build(BuildContext context) { 54 return Scaffold( 55 appBar: AppBar( 56 title: Text("動物リスト"), 57 ), 58 // ListviewでJSONデータを表示 59 body: ListView.builder( 60 itemCount: _jsonData == null ? 0 : _jsonData.length, 61 itemBuilder: (BuildContext context, int index) { 62 return Container( 63 child: Center( 64 child: Column( 65 crossAxisAlignment: CrossAxisAlignment.stretch, 66 children: <Widget>[ 67 Card( 68 child: Container( 69 child: Row( 70 children: <Widget>[ 71 Container( 72 child: Text( 73 "ID:" + _animaruData[index]['id'].toString(), 74 style: TextStyle(fontSize: 20.0) 75 ), 76 width: 50, 77 ), 78 Container( 79 child: Text( 80 "動物:" + _animaruData[index]['name'], 81 style: TextStyle(fontSize: 20.0) 82 ), 83 ), 84 Container( 85 child: Text( 86 "好物:" + _animaruData[index]['food'], 87 style: TextStyle(fontSize: 20.0) 88 ), 89 ), 90 Container( 91 child: Text( 92 "種類:" + _animaruTypeData[index]['type'], 93 style: TextStyle(fontSize: 20.0) 94 ), 95 ), 96 ], 97 ), 98 // added padding 99 padding: const EdgeInsets.all(15.0), 100 ), 101 ) 102 ], 103 )), 104 ); 105 }), 106 ); 107 } 108} 109
補足情報(FW/ツールのバージョンなど)
android studio 3.6.1
flutter 1.12.13+hotfix.8
Dart 2.7.0
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2020/05/11 10:59