Flutter How to parse Api response? - json

Question

Im working with rawg.io api and trying to get datas about games. There is a problem which i think it's about parsing data from json. I worked with easy apis which has not arrays or maps in it. But this data complicated and i guess that's why im getting always null results while try to print datas to screen.
Here is my code
import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';
import 'package:video_games/load_data.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
Future<Welcome> apiCall() async {
final response = await http.get(Uri.parse(
'https://api.rawg.io/api/games?key=5ac29048d12d45d0949c77038115cb56'));
print(response.statusCode);
print(response.body);
return Welcome.fromJson(jsonDecode(response.body));
}
#override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: FutureBuilder<Welcome>(
future: apiCall(),
builder: (context, snapshot) {
// var growableList = [];
// List<Result> data = snapshot.data!.results;
// growableList.add(data[0].name);
return Text('${snapshot.data!.count}');
},
),
),
);
}
}
That is my response body and status code without using in a widget or parsing it
I/flutter ( 3666): 200
I/flutter ( 3666): {"count":679153,"next":"https://api.rawg.io/api/games?key=5ac29048d12d45d0949c77038115cb56&page=2","previous":null,"results":[{"id":3498,"slug":"grand-theft-auto-v","name":"Grand Theft Auto V","released":"2013-09-17","tba":false,"background_image":"https://media.rawg.io/media/games/456/456dea5e1c7e3cd07060c14e96612001.jpg","rating":4.48,"rating_top":5,"ratings":[{"id":5,"title":"exceptional","count":3217,"percent":58.97},{"id":4,"title":"recommended","count":1800,"percent":33.0},{"id":3,"title":"meh","count":348,"percent":6.38},{"id":1,"title":"skip","count":90,"percent":1.65}],"ratings_count":5389,"reviews_text_count":36,"added":16689,"added_by_status":{"yet":415,"owned":9874,"beaten":4491,"toplay":474,"dropped":835,"playing":600},"metacritic":97,"playtime":71,"suggestions_count":402,"updated":"2021-08-20T12:42:02","user_game":null,"reviews_count":5455,"saturated_color":"0f0f0f","dominant_color":"0f0f0f","platforms":[{"platform":{"id":1,"name":"Xbox One","slug":"xbox-one","image":null,"year_end":null,"year_
And this is my data class
// To parse this JSON data, do
//
// final welcome = welcomeFromJson(jsonString);
import 'dart:convert';
Welcome welcomeFromJson(String str) => Welcome.fromJson(json.decode(str));
String welcomeToJson(Welcome data) => json.encode(data.toJson());
class Welcome {
Welcome({
required this.count,
required this.next,
required this.previous,
required this.results,
});
int count;
String next;
String previous;
List<Result> results;
factory Welcome.fromJson(Map<String, dynamic> json) => Welcome(
count: json["count"],
next: json["next"],
previous: json["previous"],
results:
List<Result>.from(json["results"].map((x) => Result.fromJson(x))),
);
Map<String, dynamic> toJson() => {
"count": count,
"next": next,
"previous": previous,
"results": List<dynamic>.from(results.map((x) => x.toJson())),
};
}
class Result {
Result({
required this.id,
required this.slug,
required this.name,
required this.released,
required this.tba,
required this.backgroundImage,
required this.rating,
required this.ratingTop,
required this.ratings,
required this.ratingsCount,
required this.reviewsTextCount,
required this.added,
required this.addedByStatus,
required this.metacritic,
required this.playtime,
required this.suggestionsCount,
required this.updated,
required this.esrbRating,
required this.platforms,
});
int id;
String slug;
String name;
DateTime released;
bool tba;
String backgroundImage;
int rating;
int ratingTop;
AddedByStatus ratings;
int ratingsCount;
String reviewsTextCount;
int added;
AddedByStatus addedByStatus;
int metacritic;
int playtime;
int suggestionsCount;
DateTime updated;
EsrbRating esrbRating;
List<Platform> platforms;
factory Result.fromJson(Map<String, dynamic> json) => Result(
id: json["id"],
slug: json["slug"],
name: json["name"],
released: DateTime.parse(json["released"]),
tba: json["tba"],
backgroundImage: json["background_image"],
rating: json["rating"],
ratingTop: json["rating_top"],
ratings: AddedByStatus.fromJson(json["ratings"]),
ratingsCount: json["ratings_count"],
reviewsTextCount: json["reviews_text_count"],
added: json["added"],
addedByStatus: AddedByStatus.fromJson(json["added_by_status"]),
metacritic: json["metacritic"],
playtime: json["playtime"],
suggestionsCount: json["suggestions_count"],
updated: DateTime.parse(json["updated"]),
esrbRating: EsrbRating.fromJson(json["esrb_rating"]),
platforms: List<Platform>.from(
json["platforms"].map((x) => Platform.fromJson(x))),
);
Map<String, dynamic> toJson() => {
"id": id,
"slug": slug,
"name": name,
"released":
"${released.year.toString().padLeft(4, '0')}-${released.month.toString().padLeft(2, '0')}-${released.day.toString().padLeft(2, '0')}",
"tba": tba,
"background_image": backgroundImage,
"rating": rating,
"rating_top": ratingTop,
"ratings": ratings.toJson(),
"ratings_count": ratingsCount,
"reviews_text_count": reviewsTextCount,
"added": added,
"added_by_status": addedByStatus.toJson(),
"metacritic": metacritic,
"playtime": playtime,
"suggestions_count": suggestionsCount,
"updated": updated.toIso8601String(),
"esrb_rating": esrbRating.toJson(),
"platforms": List<dynamic>.from(platforms.map((x) => x.toJson())),
};
}
class AddedByStatus {
AddedByStatus();
factory AddedByStatus.fromJson(Map<String, dynamic> json) => AddedByStatus();
Map<String, dynamic> toJson() => {};
}
class EsrbRating {
EsrbRating({
required this.id,
required this.slug,
required this.name,
});
int id;
String slug;
String name;
factory EsrbRating.fromJson(Map<String, dynamic> json) => EsrbRating(
id: json["id"],
slug: json["slug"],
name: json["name"],
);
Map<String, dynamic> toJson() => {
"id": id,
"slug": slug,
"name": name,
};
}
class Platform {
Platform({
required this.platform,
required this.releasedAt,
required this.requirements,
});
EsrbRating platform;
String releasedAt;
Requirements requirements;
factory Platform.fromJson(Map<String, dynamic> json) => Platform(
platform: EsrbRating.fromJson(json["platform"]),
releasedAt: json["released_at"],
requirements: Requirements.fromJson(json["requirements"]),
);
Map<String, dynamic> toJson() => {
"platform": platform.toJson(),
"released_at": releasedAt,
"requirements": requirements.toJson(),
};
}
class Requirements {
Requirements({
required this.minimum,
required this.recommended,
});
String minimum;
String recommended;
factory Requirements.fromJson(Map<String, dynamic> json) => Requirements(
minimum: json["minimum"],
recommended: json["recommended"],
);
Map<String, dynamic> toJson() => {
"minimum": minimum,
"recommended": recommended,
};
}
Things i tried;
tried to convert response body to string before parsing
tried to change my widget to asnyc
tried to simplify my data class (to avoid arrays)
My opinion after research,
return Welcome.fromJson(jsonDecode(response.body));
this part can't work correctly cause of json decode can't decode complex datas which is has arrays and maps.
I stuck at this point and struggling. There is no document that i can do it correctly. Please help me about this.