displaying selected data on Dropdownbutton on flutter - json

its actually continuation of my previous question, here i've been successfully populate my list with Json which i retrieved from Get method. as the suggestion, i used futurebuilder widget to build my Dropdownbutton. but my problem is: it cant display any after i picked up the dropdownlist. it crashes.
and i had other thing concerned me. my project is to receive scanned nearby wifi by an esp8266 through http GET method (and later send the password through the apps using POST method). my question is:
when im using this Futurebuilder widget, in which "time" that this app actually made http request? does it refresh all the time?
can i just populate the dropdownmenuitem in just one occasion (perhaps in initstate), then asking for refresh only when i needed it (i.e using a button). i've been trying to do this but it kept failing.
here's my code
Future<List<Post>> getAllPosts(String url) async {
final response = await http.get(url);
return allPostsFromJson(response.body);
}
List<Post> allPostsFromJson(String str) {
final jsonData = json.decode(str);
return new List<Post>.from(jsonData.map((x) => Post.fromJson(x)));
}
class Post {
String name;
String perc;
String pass;
Post({
this.name,
this.perc,
this.pass,
});
factory Post.fromJson(Map<String, dynamic> json) => new Post(
name: json["SSID"],
perc: json["RSSI"],
pass: json["PASS"],
);
Map<String, dynamic> toJson() => {
"SSID": name,
"RSSI": perc,
"PASS": pass,
};
}
class LoginPhaseState extends State<LoginPhase>{
Post selected;
final String uri = 'http://10.0.2.2/data/connection.json';
#override
Widget build(BuildContext context) {
return FutureBuilder<List<Post>>(
future: getAllPosts(uri),
builder: (BuildContext context,
AsyncSnapshot<List<Post>> snapshot) {
if (!snapshot.hasData) return CircularProgressIndicator();
return DropdownButton<Post>(
items: snapshot.data
.map((ssid) => DropdownMenuItem<Post>(
child: Text(ssid.name),
value: ssid,
))
.toList(),
onChanged: (Post value) {
setState(() {
selected = value;
});
},
isExpanded: false,
// value: selected,
hint: Text('Select User'),
);
});
}
}

try this,
Future<List<Post>> getAllPosts(String url) async {
final response = await http.get(url);
return allPostsFromJson(response.body);
}
List<Post> allPostsFromJson(String str) {
final jsonData = json.decode(str);
return new List<Post>.from(jsonData.map((x) => Post.fromJson(x)));
}
class Post {
String name;
String perc;
String pass;
Post({
this.name,
this.perc,
this.pass,
});
factory Post.fromJson(Map<String, dynamic> json) => new Post(
name: json["SSID"],
perc: json["RSSI"],
pass: json["PASS"],
);
Map<String, dynamic> toJson() => {
"SSID": name,
"RSSI": perc,
"PASS": pass,
};
}
class LoginPhaseState extends State<LoginPhase>{
Post selected;
final String uri = 'http://10.0.2.2/data/connection.json';
String _selectedChild= "";
#override
Widget build(BuildContext context) {
return FutureBuilder<List<Post>>(
future: getAllPosts(uri),
builder: (BuildContext context,
AsyncSnapshot<List<Post>> snapshot) {
if (!snapshot.hasData)
return CircularProgressIndicator();
return DropdownButton<Post>(
value: _selectedChild == "" ? null : _selectedChild,
items: snapshot.data
.map((ssid) => DropdownMenuItem<Post>(
child: Text(ssid.name),
value: ssid,
))
.toList(),
onChanged: (Post value) {
setState(() {
_selectedChild = value.name;
selected = value;
});
},
isExpanded: false,
// value: selected,
hint: Text('Select User'),
);
});
}
}

Related

Flutter json api problem, some of data not listening

Hello guys i have a small project with flutter. Try to list meals from https://www.themealdb.com/. I wish to list the meals in api. So far so good but the main problem some of the food listed some of are not.
For example Beef category not listening and give me this error:
[ERROR:flutter/lib/ui/ui_dart_state.cc(198)] Unhandled Exception: type
'Null' is not a subtype of type 'String'
but vegan category is listening.
screen Page :
class _MealScreenState extends State<MealScreen> {
List<Meal> mealsIn = [];
Future<bool> getMealInside() async {
Uri uri = Uri.parse(
'https://www.themealdb.com/api/json/v1/1/search.php?s=${widget.names}');
final response = await http.get(uri);
if (response.statusCode == 200) {
final result = mealsJsonFromJson(response.body);
mealsIn = result.meals;
setState(() {});
return true;
} else {
return false;
}
}
#override
void initState() {
super.initState();
getMealInside();
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.names),
),
body: ListView.separated(
itemBuilder: (context, index) {
final mealsOut = mealsIn[index];
return ListTile(
title: Text(mealsOut.strMeal != null
? mealsOut.strMeal.toString()
: 'Loading'),
leading: Image.network(mealsOut.strMealThumb),
);
},
separatorBuilder: (context, index) => Divider(),
itemCount: mealsIn.length
),
);
}
}
model page:
import 'dart:convert';
MealData mealDataFromJson(String str) => MealData.fromJson(json.decode(str));
String mealDataToJson(MealData data) => json.encode(data.toJson());
class MealData {
MealData({
required this.categories,
});
List<Category> categories;
factory MealData.fromJson(Map<String, dynamic> json) => MealData(
categories: List<Category>.from(json["categories"].map((x) => Category.fromJson(x))),
);
Map<String, dynamic> toJson() => {
"categories": List<dynamic>.from(categories.map((x) => x.toJson())),
};
class Category {
Category({
required this.idCategory,
required this.strCategory,
required this.strCategoryThumb,
required this.strCategoryDescription,
});
String idCategory;
String strCategory;
String strCategoryThumb;
String strCategoryDescription;
factory Category.fromJson(Map<String, dynamic> json) => Category(
idCategory: json["idCategory"],
strCategory: json["strCategory"],
strCategoryThumb: json["strCategoryThumb"],
strCategoryDescription: json["strCategoryDescription"],
);
Map<String, dynamic> toJson() => {
"idCategory": idCategory,
"strCategory": strCategory,
"strCategoryThumb": strCategoryThumb,
"strCategoryDescription": strCategoryDescription,
};
}
Beef
Vegan
You have to add null check for each keys : for Category class
factory Category.fromJson(Map<String, dynamic> json) => Category(
idCategory: json["idCategory"] ?? "",
strCategory: json["strCategory"] ?? "",
strCategoryThumb: json["strCategoryThumb"] ?? "",
strCategoryDescription: json["strCategoryDescription"] ?? "",
);

Unable to display the parsed JSON in Future Builder in flutter

I was trying to fetch data results from a REST API and then display it in the UI.
So everything went well the JSON was parsed well the try and catch method was working fine.
But somehow the code was not able to display the parsed results in the UI.
Neither it gave me an error or exception.
I have been struggling to attain the desired result for quite the past few days.
This is how the JSON looks like:
{
"data-description": "This api will return an array of objects to be placed in the order status timeline on the second screen",
"order-status": "Success",
"status-objects": [
{
"type": "Payment",
"status": "completed",
"date": "2021-07-02T00:00:00",
"time": "12:00AM"
},
{
"type": "Units Allocated",
"status": "by Axis",
"date": "2021-07-13T00:00:00",
"time": "12:00AM"
}
]
}
What type of UI I want to achieve after doing this.
In order to make the problem more clearly, I will be attaching my code snippets.
Model Class
Transaction transactionFromJson(String str) =>
Transaction.fromJson(json.decode(str));
String transactionToJson(Transaction data) => json.encode(data.toJson());
class Transaction {
Transaction({
required this.dataDescription,
required this.orderStatus,
required this.statusObjects,
});
String dataDescription;
String orderStatus;
List<StatusObject> statusObjects;
factory Transaction.fromJson(Map<String, dynamic> json) => Transaction(
dataDescription: json["data-description"],
orderStatus: json["order-status"],
statusObjects: List<StatusObject>.from(
json["status-objects"].map((x) => StatusObject.fromJson(x))),
);
Map<String, dynamic> toJson() => {
"data-description": dataDescription,
"order-status": orderStatus,
"status-objects":
List<dynamic>.from(statusObjects.map((x) => x.toJson())),
};
}
class StatusObject {
StatusObject({
required this.type,
required this.status,
required this.date,
required this.time,
});
String type;
String status;
DateTime date;
String time;
factory StatusObject.fromJson(Map<String, dynamic> json) => StatusObject(
type: json["type"],
status: json["status"],
date: DateTime.parse(json["date"]),
time: json["time"],
);
Map<String, dynamic> toJson() => {
"type": type,
"status": status,
"date": date.toIso8601String(),
"time": time,
};
}
API_Manager where the parsing and fetching took place
Service Class
class API_Manager {
static Future<Transaction> getDetails() async {
var client = http.Client();
var transactions;
try {
var response = await client.get(
Uri.https("https://hereistheurl", "/accounts/test-data/"));
if (response.statusCode == 200) {
var jsonString = response.body;
var jsonMap = jsonDecode(jsonString);
transactions = Transaction.fromJson(jsonMap);
}
} catch (e) {
return transactions;
}
return transactions;
}
}
The UI component where I wanted to display the parsed JSON:
Code
FutureBuilder<Transaction>(
future: API_Manager.getDetails(),
builder: (context, snapshot) {
if (snapshot.hasData) {
var data = snapshot.data!.statusObjects;
return ListView.builder(
itemCount: data.length,
itemBuilder: (context, index) =>
Text('$index : ${data[index].status}'),
);
}
return Text('Something was wrong!');
},
),
I am quite sure that I have been missing a very small piece of code to make it work.
I have been working on this piece of code for quite a few days but am unable to do it.
I request you, people, to please help me out in attaining the result or point out the piece of code that I have left out.
Will appreciate it if you could help me in any possible way.
Bro, your are using wrongly *builder widgets, I've made some corrections at your code:
Service class
typedef JMap = Map<String, dynamic>;
class API_Manager {
static Future<Transaction> getData() {
return Future.delayed(Duration(seconds: 1), () => raw_response)
.then((response) {
return Transaction.fromJson(jsonDecode(response) as JMap);
});
}
}
const raw_response = '''
{
"data-description": "This api will return an array of objects to be placed in the order status timeline on the second screen",
"order-status": "Success",
"status-objects": [
...
]
}
''';
Presentation
class HomePage extends StatelessWidget {
const HomePage({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Hi!'),
centerTitle: true,
),
body: Container(
child: FutureBuilder<Transaction>(
future: API_Manager.getData(),
builder: (context, snapshot) {
if (snapshot.hasError)
return Text(snapshot.error.toString());
if (snapshot.connectionState == ConnectionState.waiting)
return Center(child: CircularProgressIndicator());
if (snapshot.connectionState == ConnectionState.done && snapshot.hasData) {
final data = snapshot.data!.statusObjects;
return ListView.builder(
itemCount: data.length,
itemBuilder: (context, index) => Text('$index : ${data[index].status}'),
);
}
return Text('Something was wrong!');
},
),
),
);
}
}
Result:
UPDATED(1)
static Future<Transaction?> getDetails(String url) {
return http.get(Uri.parse(url))
.then((response) {
if (response.statusCode == 200)
return Transaction.fromJson(jsonDecode(response.body) as JMap);
return null;
})
.catchError((err) { print(err); });
}

Flutter - Errors when trying to save JSON Array to List

I am new to flutter and trying to fetch API data into a list. My goal is to later input that information into a ListView.
I am familiar with doing api calls but now I'm triying to get information from a json array. Previously I made a model class to retrieve the objects I need to continue with my process, but I've reached a dead end since I can't seem to figure out how to extract the objects from an array properly.
I am using multiple files. "API Services", "readData Model", and the actual screen where the data will be shown.
Everything else is fine, it's just that I am unable to actually save the data to a list.
First I will show you how my code is set up and the JSON response data I am trying to save:
JSON Response Body:
The example I am showing only has one chunk of image data, but we need an array for it since it should be displaying every chunk in a list.
{"status":200,
"content":[{"image_id":"151",
"image_url":"https:\\\/imageurl.jpg",
"returned_value":"14.0",
"alarm":"false",
"account":"test#email.com",
"create_at":"2020-11-17 07:13:42",
"location":"NY"
}]
}
API POST function:
Future<ReadResponseModel> readData(
ReadRequestModel requestData) async {
final response = await http.post("$url/read",
body: requestData.toJson() ,
headers: {
"Client-Service": "frontend-client",
"Auth-Key": "simplerestapi",
"Content-Type":"application/x-www-form-urlencoded",
"Authorization": token,
"User-ID": userId,
});
print(response.body);
if (response.statusCode == 200 || response.statusCode == 400) {
dynamic resBody = json.decode(response.body);
return ReadResponseModel.fromJson(resBody);
} else {
throw Exception('Failed to load data!');
}
}
readResponseModel Class:
I have tried two methods to process this information but have failed at both of them.
This is Method 1:
This one will give me the following error: [ERROR:flutter/lib/ui/ui_dart_state.cc(177)] Unhandled Exception: type 'String' is not a subtype of type 'int' of 'index'
Originally set as final String for all values, but since I was getting this error I've been trying to make sure each one is the correct type (ex. retVal as int or alarm as bool). Still no luck so far.
class ReadResponseModel {
final dynamic imageID;
final dynamic imgUrl;
final dynamic retVal;
final bool alarm;
final dynamic account;
final dynamic createAt;
final dynamic location;
ReadResponseModel({this.imageID, this.imgUrl, this.retVal, this.alarm,
this.account, this.createAt, this.location,});
factory ReadResponseModel.fromJson(Map<String , dynamic> json) {
return ReadResponseModel(
imageID: json['content']['image_id'] as String ,
imgUrl: json['content']['image_url'] as String ,
retVal: json['content']["returned_value"] as String,
alarm: json['content']['alarm'] as bool ,
account: json['content']['account'] as String,
createAt: json['content']['create_at'] as String,
location: json['content']['location'] as String,
);
}
}
Method 2:
This one will give me the following error:
[ERROR:flutter/lib/ui/ui_dart_state.cc(177)] Unhandled Exception: type '(dynamic) => Content' is not a subtype of type '(dynamic) => String' of 'f' -- I dont even know where that f came from.
class ReadResponseModel {
List<String> content;
ReadResponseModel({this.content});
factory ReadResponseModel.fromJson(Map<String, dynamic> json) {
return ReadResponseModel(
content: json['content'] != null
? json['content']
.map<String>((json) => Content.fromJson(json))
.toList()
: null,
);
}
}
class Content {
final String imageID;
final String imgUrl;
final String retVal;
final String alarm;
final String account;
final String createAt;
final String location;
final String error;
Content({this.imageID,
this.imgUrl,
this.retVal,
this.alarm,
this.account,
this.createAt,
this.location,
this.error});
factory Content.fromJson(Map<String, dynamic> json) =>
Content(
imageID: json['image_id'],
imgUrl: json['s3_url'],
retVal: json['predict'],
alarm: json['alarm'],
account: json['account'],
createAt: json['create_at'],
location: json['location'],
);
}
The following code is just what I'm doing to connect all this to my widget:
APIService readService = new APIService();
readRequestModel.companyID = "123";
readService.readData(readRequestModel).then((value) async {
if (value != null) {
setState(() {
isApiCallProcess = false;
});
///Trying to call the fetched data and show it in the console:
print("Account: ${value.account}");
print("Returned Value: ${value.retVal}");
print("Image ID: ${value.imgUrl}");
}
I'm not entirely sure why I am getting these errors, and for method 2 I don't even know where that "f" came from. If anyone could shed some light on the subject it would be greatly appreciated.
You can copy paste run full code below
Step 1: Use List<Content> content; not List<String>
Step 2: Use List<Content>.from(json["content"].map((x) => Content.fromJson(x)))
Step 3: In sample JSON's image_url not equal model's s3_url, you need to modify to correct one
code snippet
class ReadResponseModel {
List<Content> content;
ReadResponseModel({this.content});
factory ReadResponseModel.fromJson(Map<String, dynamic> json) {
return ReadResponseModel(
content: json['content'] != null
? List<Content>.from(json["content"].map((x) => Content.fromJson(x)))
: null,
);
}
}
...
dynamic resBody = json.decode(jsonString);
ReadResponseModel model = ReadResponseModel.fromJson(resBody);
print(model.content[0].account);
output
I/flutter ( 4426): test#email.com
full code
import 'package:flutter/material.dart';
import 'dart:convert';
class ReadResponseModel {
List<Content> content;
ReadResponseModel({this.content});
factory ReadResponseModel.fromJson(Map<String, dynamic> json) {
return ReadResponseModel(
content: json['content'] != null
? List<Content>.from(json["content"].map((x) => Content.fromJson(x)))
: null,
);
}
}
class Content {
final String imageID;
final String imgUrl;
final String retVal;
final String alarm;
final String account;
final String createAt;
final String location;
final String error;
Content(
{this.imageID,
this.imgUrl,
this.retVal,
this.alarm,
this.account,
this.createAt,
this.location,
this.error});
factory Content.fromJson(Map<String, dynamic> json) => Content(
imageID: json['image_id'],
imgUrl: json['s3_url'],
retVal: json['predict'],
alarm: json['alarm'],
account: json['account'],
createAt: json['create_at'],
location: json['location'],
);
}
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
home: MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
#override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
int _counter = 0;
void _incrementCounter() {
String jsonString = '''
{"status":200,
"content":[{"image_id":"151",
"image_url":"https:\\\/imageurl.jpg",
"returned_value":"14.0",
"alarm":"false",
"account":"test#email.com",
"create_at":"2020-11-17 07:13:42",
"location":"NY"
}]
}
''';
dynamic resBody = json.decode(jsonString);
ReadResponseModel model = ReadResponseModel.fromJson(resBody);
print(model.content[0].account);
setState(() {
_counter++;
});
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
'You have pushed the button this many times:',
),
Text(
'$_counter',
style: Theme.of(context).textTheme.headline4,
),
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: _incrementCounter,
tooltip: 'Increment',
child: Icon(Icons.add),
),
);
}
}
From the above mentioned code I have created a sample example for you, basically you are messing up with the mode class.Take a look at the example below.
Json you provided:
{"status":200,
"content":[{"image_id":"151",
"image_url":"https:\\\/imageurl.jpg",
"returned_value":"14.0",
"alarm":"false",
"account":"test#email.com",
"create_at":"2020-11-17 07:13:42",
"location":"NY"
}]
}
Based on the json the model class below :
// To parse this JSON data, do
//
// final readResponseModel = readResponseModelFromJson(jsonString);
import 'dart:convert';
ReadResponseModel readResponseModelFromJson(String str) => ReadResponseModel.fromJson(json.decode(str));
String readResponseModelToJson(ReadResponseModel data) => json.encode(data.toJson());
class ReadResponseModel {
ReadResponseModel({
this.status,
this.content,
});
int status;
List<Content> content;
factory ReadResponseModel.fromJson(Map<String, dynamic> json) => ReadResponseModel(
status: json["status"],
content: List<Content>.from(json["content"].map((x) => Content.fromJson(x))),
);
Map<String, dynamic> toJson() => {
"status": status,
"content": List<dynamic>.from(content.map((x) => x.toJson())),
};
}
class Content {
Content({
this.imageId,
this.imageUrl,
this.returnedValue,
this.alarm,
this.account,
this.createAt,
this.location,
});
String imageId;
String imageUrl;
String returnedValue;
String alarm;
String account;
DateTime createAt;
String location;
factory Content.fromJson(Map<String, dynamic> json) => Content(
imageId: json["image_id"],
imageUrl: json["image_url"],
returnedValue: json["returned_value"],
alarm: json["alarm"],
account: json["account"],
createAt: DateTime.parse(json["create_at"]),
location: json["location"],
);
Map<String, dynamic> toJson() => {
"image_id": imageId,
"image_url": imageUrl,
"returned_value": returnedValue,
"alarm": alarm,
"account": account,
"create_at": createAt.toIso8601String(),
"location": location,
};
}
And them main class for fetching the data and showing it in the listview.
import 'package:flutter/material.dart';
import 'package:json_parsing_example/model2.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
home: SampleApp(),
debugShowCheckedModeBanner: false,
);
}
}
class SampleApp extends StatefulWidget {
#override
_SampleAppState createState() => _SampleAppState();
}
class _SampleAppState extends State<SampleApp> {
bool _isLoading = false;
List<Content> list = List();
fetchData() async {
setState(() {
_isLoading = true;
});
String data =
await DefaultAssetBundle.of(context).loadString("json/parse.json");
// This is the above where you get the remote data
// Like var response = await get or post
final readResponseModel = readResponseModelFromJson(data);
list = readResponseModel.content;
setState(() {
_isLoading = false;
});
}
#override
void initState() {
super.initState();
fetchData();
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Your heading'),
),
body: Container(
child: _isLoading
? Center(child: CircularProgressIndicator())
: Column(
children: <Widget>[
ListView.builder(
shrinkWrap: true,
itemCount: list.length,
itemBuilder: (context, index) {
return Card(
child: Column(
children: <Widget>[
Text('${list[index].account}'),
Text('${list[index].location}')
],
),
);
})
],
)));
}
}
Let me know if it works
Can you try setting returned_value and image_id as int instead of string and give it a try ?

Flutter how to get the data of a json

Good I have the following problem I have a json the following http:// and I have the class to get the data for which use https://app.quicktype.io/ and the code is as follows
// To parse this JSON data, do
//
// final moviesFirstLoad = moviesFirstLoadFromJson(jsonString);
import 'dart:convert';
MoviesFirstLoad moviesFirstLoadFromJson(String str) {
final jsonData = json.decode(str);
return MoviesFirstLoad.fromJson(jsonData);
}
String moviesFirstLoadToJson(MoviesFirstLoad data) {
final dyn = data.toJson();
return json.encode(dyn);
}
class MoviesFirstLoad {
List<Movierecent> movierecent;
MoviesFirstLoad({
this.movierecent,
});
factory MoviesFirstLoad.fromJson(Map<String, dynamic> json) => new MoviesFirstLoad(
movierecent: new List<Movierecent>.from(json["movierecent"].map((x) => Movierecent.fromJson(x))),
);
Map<String, dynamic> toJson() => {
"movierecent": new List<dynamic>.from(movierecent.map((x) => x.toJson())),
};
}
class Movierecent {
int id;
String movieId;
String title;
String genre;
String myear;
String released;
String runtime;
String rated;
String director;
String actors;
String plot;
String imdbrating;
String type;
String production;
int internalid;
String poster;
Movierecent({
this.id,
this.movieId,
this.title,
this.genre,
this.myear,
this.released,
this.runtime,
this.rated,
this.director,
this.actors,
this.plot,
this.imdbrating,
this.type,
this.production,
this.internalid,
this.poster,
});
factory Movierecent.fromJson(Map<String, dynamic> json) => new Movierecent(
id: json["id"],
movieId: json["movieID"],
title: json["title"],
genre: json["genre"],
myear: json["myear"],
released: json["released"],
runtime: json["runtime"],
rated: json["rated"],
director: json["director"],
actors: json["actors"],
plot: json["plot"],
imdbrating: json["imdbrating"],
type: json["type"],
production: json["production"],
internalid: json["internalid"],
poster: json["poster"],
);
Map<String, dynamic> toJson() => {
"id": id,
"movieID": movieId,
"title": title,
"genre": genre,
"myear": myear,
"released": released,
"runtime": runtime,
"rated": rated,
"director": director,
"actors": actors,
"plot": plot,
"imdbrating": imdbrating,
"type": type,
"production": production,
"internalid": internalid,
"poster": poster,
};
}
Now the first label shows me that I should use
final moviesFirstLoad = moviesFirstLoadFromJson(jsonString);
therefore I have the following and here I do not know what to do as accessing the data to place them in a list would be something like
Future<List<Movierecent>> loadMovies() async {
final response = await http.get("http://emovies.evolucionone.com/");
if (response.statusCode == 200){
final moviesFirstLoad = moviesFirstLoadFromJson(response.body);
return moviesFirstLoad.movierecent;
}else{
throw Exception ('Failed to load Data');
}
}
I need help to get the data of the json if someone helps me I have already read several topics but none of them works for me ...
Well I answer my questions myself
This to get the data from json
Future<MoviesFirstLoad> loadMovies() async {
final Response response = await http.get(dogApiUrl);
//final List<Movierecent> posterimage = List<Movierecent>();
if (response.statusCode == 200){
//final responsejson = json.decode(response.body);
final moviesFirstLoad = moviesFirstLoadFromJson(response.body);
// moviesFirstLoad.movierecent.forEach((poster) => posterimage.add(poster));
print(moviesFirstLoad);
return moviesFirstLoad;
}else{
throw Exception ('Failed to load Data');
}
}
to show the data in a list
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('Movies')),
body: FutureBuilder(
future: loadMovies(),
builder: (BuildContext context, AsyncSnapshot<AppData> snapshot) {
if (!snapshot.hasData) {
return Center(
child: CircularProgressIndicator(),
);
}
return ListView.builder(
itemCount: snapshot.data.movierecent.length,
itemBuilder: (BuildContext context, int index) {
final Movierecent movie = snapshot.data.movierecent[index];
return ListTile(
title: Text(movie.title),
subtitle: Text(movie.genre),
);
},
);
},
),
);
}
}
loadMovies() returns Future<List<Movierecent>> which is a future. If you want underlying list of movies, you could do someting like
loadMovies().then((List<Movierecent> movieList) {
/* do what you want to do here like invoking setState()....*/
}.catchError((e) {
/* Handle Error scenario here */
};
You might want to refer Dart documentation of Futures

Getting error type'_InternalLinkedHashMap<String, dynamic>' is not a subtype of type 'Iterable<dynamic>' while fetching data from API in flutter

I am new to flutter and I tried fetching data from API but I got the error
type'_InternalLinkedHashMap<String, dynamic>' is not a subtype of type 'Iterable<dynamic>'.
I am fetching news data from the API. I tried this for simple API and it worked and when I tried it for a complex API with some changes in the dart code I got this error.
Sorry if I didn't explain correctly. I have pasted all the code that has been used for this API.
I am not getting any solution. I am posting my code here.
post.dart
class Post {
List<Articles> articles;
Post({this.articles});
factory Post.fromJson(Map<String, dynamic> json) {
return Post(
articles: json['articles'].map((value) => new Articles.fromJson(value)).toList(),
);
}
}
article.dart
class Articles{
final String title;
final String description;
final String url;
final String urlToImage;
final String publishedAt;
final String content;
Articles({this.title, this.description, this.url, this.urlToImage, this.publishedAt, this.content});
factory Articles.fromJson(Map<String, dynamic> json) {
return Articles(
title: json['title'],
description: json['description'],
url: json['url'],
urlToImage: json['urlToImage'],
publishedAt: json['publishedAt'],
content: json['content'],
);
}
}
technology_post.dart
Future<List<Post>> fetchPost() async {
final response = await http.get('https://newsapi.org/v2/top-headlines?sources=techcrunch&apiKey=47ada2986be0434699996aaf4902169b');
if (response.statusCode == 200) {
var responseData = json.decode(response.body);
List<Post> posts = [];
for(var item in responseData){
Post news = Post.fromJson(item);
posts.add(news);
}
return posts;
} else {
throw Exception('Failed to load post');
}
}
class Technology extends StatelessWidget{
final Future<List<Post>> post;
Technology({Key key, this.post}) : super (key : key);
#override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: FutureBuilder<List<Post>>(
future: post,
builder: (context, snapshot) {
if (snapshot.hasData) {
return ListView.builder(
itemBuilder: (BuildContext context, int index){
var dataStored = "";
for(var i = 0; i < 10; i++){
dataStored = snapshot.data.articles[i].title;
return ListTile(
title: Text(dataStored),
);
}
}
);
} else if (snapshot.hasError) {
return Text("${snapshot.error}");
}
return CircularProgressIndicator();
},
),
),
);
}
}
homescreen.dart
TabBarView(
children: [
Technology(post: fetchPost()),
Text('General'),
Text('Cricket')
]
I have posted all the required code I hope. If you want to see the API you can see that here
Sorry if I have pasted much code here.
Why am I getting this error and how can I resolve this.
Thanks in advance.
According to your json, there is no List but only Post as json is json object.
So change your fetchPost() function as follows:
Future<Post> fetchPost() async {
final response = await http.get(
'https://newsapi.org/v2/top-headlines?
sources=techcrunch&apiKey=$YOUR_API_KEY');
if (response.statusCode == 200) {
var responseData = jsonDecode(response.body);
var post = Post.fromJson(responseData);
return post;
} else {
throw Exception('Failed to load post');
}
}
NOTE : Remove your api key from your question and paste json only for privacy.
And change your technology class to
class Technology extends StatelessWidget {
final Future<Post> post;
Technology({Key key, this.post}) : super(key: key);
#override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: FutureBuilder<Post>(
future: post,
builder: (context, snapshot) {
if (snapshot.hasData) {
return ListView.builder(
itemBuilder: (BuildContext context, int index) {
return Text(snapshot.data.articles[0].publishedAt);
});
} else if (snapshot.hasError) {
return Text("${snapshot.error}");
}
return CircularProgressIndicator();
},
),
),
);
}
}
and your main problem is also that you have not cast json['articles'] to list. you should change Post.fromJson function to
factory Post.fromJson(Map<String, dynamic> json) {
return Post(
articles: (json['articles'] as List).map((value) => new Articles.fromJson(value)).toList(),
);
}
This should solve your problem.
You should check correct response type Int with String. I see your API status: "ok" and sure you check correctly.