Good day everyone
I want to display items from the api data in a listview on the next page on button submit, may you please help. I have managed to print the api data response in the console using response.data, now I just want to show certain items in a list, not all the data.
I want to achieve the results like the below screenshot I posted.
Below is my api response:
[
{
"Id": 0,
"SourceId": 0,
"ServiceId": 11,
"CategoryId": 5,
"Category": "Valuation",
"Description": "AdjustedValues",
"Value": [],
"ServiceResponsePropertyId": 474,
"MappingId": 0,
"IsVisible": true,
"PackageRequestId": 13818024,
"SortOrder": 1
},
{
"Id": 0,
"SourceId": 0,
"ServiceId": 11,
"CategoryId": 1,
"Category": "General",
"Description": "ServiceStatus",
"Value": {
"StatusCode": 1,
"StatusDescription": "Ok",
"StatusDetail": "",
"RestServiceStatus": null,
"ServiceResource": null
},
"ServiceResponsePropertyId": 475,
"MappingId": 0,
"IsVisible": false,
"PackageRequestId": 13818024,
"SortOrder": 1
},
{
"Id": 0,
"SourceId": 0,
"ServiceId": 6,
"CategoryId": 1,
"Category": "General",
"Description": "CarId",
"Value": 120354,
"ServiceResponsePropertyId": 100,
"MappingId": 0,
"IsVisible": false,
"PackageRequestId": 13818024,
"SortOrder": 1
},
{
"Id": 0,
"SourceId": 0,
"ServiceId": 6,
"CategoryId": 1,
"Category": "General",
"Description": "Year",
"Value": 2017,
"ServiceResponsePropertyId": 103,
"MappingId": 0,
"IsVisible": true,
"PackageRequestId": 13818024,
"SortOrder": 6
},
{
"Id": 0,
"SourceId": 0,
"ServiceId": 6,
"CategoryId": 1,
"Category": "General",
"Description": "Full Model Description",
"Value": "2017 AUDI A3 Sedan 1.0T FSI S tronic [2016-2017]",
"ServiceResponsePropertyId": 104,
"MappingId": 0,
"IsVisible": false,
"PackageRequestId": 13818024,
"SortOrder": 1
},
{
"Id": 0,
"SourceId": 0,
"ServiceId": 6,
"CategoryId": 1,
"Category": "General",
"Description": "Model",
"Value": "A3 Sedan 1.0T FSI S tronic [2016-2017]",
"ServiceResponsePropertyId": 105,
"MappingId": 0,
"IsVisible": true,
"PackageRequestId": 13818024,
"SortOrder": 5
},
{
"Id": 0,
"SourceId": 0,
"ServiceId": 6,
"CategoryId": 1,
"Category": "General",
"Description": "ImageUrl",
"Value": "https://cdn.lightstoneauto.co.za/PHOTOS/AUDI/120354_1_Z7.jpg",
"ServiceResponsePropertyId": 107,
"MappingId": 0,
"IsVisible": false,
"PackageRequestId": 13818024,
"SortOrder": 1
},
{
"Id": 0,
"SourceId": 0,
"ServiceId": 6,
"CategoryId": 1,
"Category": "General",
"Description": "Make",
"Value": "AUDI",
"ServiceResponsePropertyId": 110,
"MappingId": 0,
"IsVisible": true,
"PackageRequestId": 13818024,
"SortOrder": 3
},
{
"Id": 0,
"SourceId": 0,
"ServiceId": 6,
"CategoryId": 1,
"Category": "General",
"Description": "Type",
"Value": "AUDI A3 Sedan",
"ServiceResponsePropertyId": 111,
"MappingId": 0,
"IsVisible": true,
"PackageRequestId": 13818024,
"SortOrder": 4
},
{
"Id": 0,
"SourceId": 0,
"ServiceId": 6,
"CategoryId": 1,
"Category": "General",
"Description": "ServiceStatus",
"Value": {
"StatusCode": 1,
"StatusDescription": "Ok",
"StatusDetail": "",
"RestServiceStatus": null,
"ServiceResource": null
},
"ServiceResponsePropertyId": 125,
"MappingId": 0,
"IsVisible": false,
"PackageRequestId": 13818024,
"SortOrder": 1
},
{
"Id": 0,
"SourceId": 0,
"ServiceId": 7,
"CategoryId": 1,
"Category": "General",
"Description": "ServiceStatus",
"Value": {
"StatusCode": 1,
"StatusDescription": "Ok",
"StatusDetail": "",
"RestServiceStatus": null,
"ServiceResource": null
},
"ServiceResponsePropertyId": 126,
"MappingId": 0,
"IsVisible": false,
"PackageRequestId": 13818024,
"SortOrder": 9999
},
{
"CarId": 0,
"SpecCategory": "General",
"Id": -1,
"SourceId": -1,
"ServiceId": 7,
"CategoryId": 1,
"Category": "General",
"Description": "Body shape",
"Value": "Sedan",
"ServiceResponsePropertyId": 320,
"MappingId": 0,
"IsVisible": true,
"PackageRequestId": 13818024,
"SortOrder": 9999
},
{
"CarId": 0,
"SpecCategory": "General",
"Id": -6,
"SourceId": -6,
"ServiceId": 7,
"CategoryId": 1,
"Category": "General",
"Description": "Drive type",
"Value": "4x2",
"ServiceResponsePropertyId": 154,
"MappingId": 0,
"IsVisible": true,
"PackageRequestId": 13818024,
"SortOrder": 9999
},
{
"CarId": 0,
"SpecCategory": "General",
"Id": -7,
"SourceId": -7,
"ServiceId": 7,
"CategoryId": 1,
"Category": "General",
"Description": "Fuel type",
"Value": "Petrol",
"ServiceResponsePropertyId": 153,
"MappingId": 0,
"IsVisible": true,
"PackageRequestId": 13818024,
"SortOrder": 9999
},
{
"Id": 0,
"SourceId": 0,
"ServiceId": 12,
"CategoryId": 5,
"Category": "Valuation",
"Description": "LastFiveSales",
"Value": [
{
"SaleId": 698229,
"CarId": 120354,
"SaleYear": 2017,
"SaleDateTime": "2022-06-09T15:30:38Z",
"SalePrice": 299900.0,
"MunicipalityName": "CITY OF TSHWANE",
"Id": 0,
"SourceId": 0,
"ServiceId": 0,
"CategoryId": 0,
"Category": null,
"Description": null,
"Value": null,
"ServiceResponsePropertyId": 0,
"MappingId": 1,
"IsVisible": false,
"PackageRequestId": 0,
"SortOrder": 0
},
{
"SaleId": 695530,
"CarId": 120354,
"SaleYear": 2017,
"SaleDateTime": "2022-05-30T13:24:17Z",
"SalePrice": 289995.0,
"MunicipalityName": "CITY OF TSHWANE",
"Id": 0,
"SourceId": 0,
"ServiceId": 0,
"CategoryId": 0,
"Category": null,
"Description": null,
"Value": null,
"ServiceResponsePropertyId": 0,
"MappingId": 1,
"IsVisible": false,
"PackageRequestId": 0,
"SortOrder": 0
},
{
"SaleId": 685020,
"CarId": 120354,
"SaleYear": 2017,
"SaleDateTime": "2022-04-14T12:27:37Z",
"SalePrice": 366948.0,
"MunicipalityName": "EMFULENI",
"Id": 0,
"SourceId": 0,
"ServiceId": 0,
"CategoryId": 0,
"Category": null,
"Description": null,
"Value": null,
"ServiceResponsePropertyId": 0,
"MappingId": 1,
"IsVisible": false,
"PackageRequestId": 0,
"SortOrder": 0
},
{
"SaleId": 683843,
"CarId": 120354,
"SaleYear": 2017,
"SaleDateTime": "2022-04-11T15:00:38Z",
"SalePrice": 315500.0,
"MunicipalityName": "UMHLATHUZE",
"Id": 0,
"SourceId": 0,
"ServiceId": 0,
"CategoryId": 0,
"Category": null,
"Description": null,
"Value": null,
"ServiceResponsePropertyId": 0,
"MappingId": 1,
"IsVisible": false,
"PackageRequestId": 0,
"SortOrder": 0
},
{
"SaleId": 652718,
"CarId": 120354,
"SaleYear": 2017,
"SaleDateTime": "2022-04-01T11:53:45Z",
"SalePrice": 339900.0,
"MunicipalityName": "CITY OF TSHWANE",
"Id": 0,
"SourceId": 0,
"ServiceId": 0,
"CategoryId": 0,
"Category": null,
"Description": null,
"Value": null,
"ServiceResponsePropertyId": 0,
"MappingId": 1,
"IsVisible": false,
"PackageRequestId": 0,
"SortOrder": 0
}
],
"ServiceResponsePropertyId": 481,
"MappingId": 0,
"IsVisible": true,
"PackageRequestId": 13818024,
"SortOrder": 0
},
{
"Id": 0,
"SourceId": 0,
"ServiceId": 12,
"CategoryId": 5,
"Category": "Valuation",
"Description": "ServiceStatus",
"Value": {
"StatusCode": 1,
"StatusDescription": "Ok",
"StatusDetail": "",
"RestServiceStatus": null,
"ServiceResource": null
},
"ServiceResponsePropertyId": 482,
"MappingId": 0,
"IsVisible": false,
"PackageRequestId": 13818024,
"SortOrder": 0
},
{
"EstimateType": "Auction",
"CarId": 0,
"Id": 1,
"SourceId": 1,
"ServiceId": 12,
"CategoryId": 5,
"Category": "Valuation",
"Description": "Auction Estimate",
"Value": 189400.0,
"ServiceResponsePropertyId": 494,
"MappingId": 0,
"IsVisible": true,
"PackageRequestId": 13818024,
"SortOrder": 1
},
{
"EstimateType": "Cost",
"CarId": 0,
"Id": 2,
"SourceId": 2,
"ServiceId": 12,
"CategoryId": 5,
"Category": "Valuation",
"Description": "Cost Estimate",
"Value": 238300.0,
"ServiceResponsePropertyId": 495,
"MappingId": 0,
"IsVisible": true,
"PackageRequestId": 13818024,
"SortOrder": 1
},
{
"EstimateType": "Cost",
"CarId": 0,
"Id": 3,
"SourceId": 3,
"ServiceId": 12,
"CategoryId": 5,
"Category": "Valuation",
"Description": "Cost Estimate High",
"Value": 259800.0,
"ServiceResponsePropertyId": 496,
"MappingId": 0,
"IsVisible": true,
"PackageRequestId": 13818024,
"SortOrder": 3
},
{
"EstimateType": "Cost",
"CarId": 0,
"Id": 4,
"SourceId": 4,
"ServiceId": 12,
"CategoryId": 5,
"Category": "Valuation",
"Description": "Cost Estimate Low",
"Value": 218700.0,
"ServiceResponsePropertyId": 497,
"MappingId": 0,
"IsVisible": true,
"PackageRequestId": 13818024,
"SortOrder": 2
},
{
"EstimateType": "Retail",
"CarId": 0,
"Id": 5,
"SourceId": 5,
"ServiceId": 12,
"CategoryId": 5,
"Category": "Valuation",
"Description": "Retail Estimate",
"Value": 300800.0,
"ServiceResponsePropertyId": 498,
"MappingId": 0,
"IsVisible": true,
"PackageRequestId": 13818024,
"SortOrder": 1
},
{
"EstimateType": "Retail",
"CarId": 0,
"Id": 6,
"SourceId": 6,
"ServiceId": 12,
"CategoryId": 5,
"Category": "Valuation",
"Description": "Retail Estimate High",
"Value": 327900.0,
"ServiceResponsePropertyId": 499,
"MappingId": 0,
"IsVisible": true,
"PackageRequestId": 13818024,
"SortOrder": 3
},
{
"EstimateType": "Retail",
"CarId": 0,
"Id": 7,
"SourceId": 7,
"ServiceId": 12,
"CategoryId": 5,
"Category": "Valuation",
"Description": "Retail Estimate Low",
"Value": 276000.0,
"ServiceResponsePropertyId": 500,
"MappingId": 0,
"IsVisible": true,
"PackageRequestId": 13818024,
"SortOrder": 2
},
{
"EstimateType": "Trade",
"CarId": 0,
"Id": 8,
"SourceId": 8,
"ServiceId": 12,
"CategoryId": 5,
"Category": "Valuation",
"Description": "Trade Estimate",
"Value": 261300.0,
"ServiceResponsePropertyId": 501,
"MappingId": 0,
"IsVisible": true,
"PackageRequestId": 13818024,
"SortOrder": 1
},
{
"EstimateType": "Trade",
"CarId": 0,
"Id": 9,
"SourceId": 9,
"ServiceId": 12,
"CategoryId": 5,
"Category": "Valuation",
"Description": "Trade Estimate High",
"Value": 284900.0,
"ServiceResponsePropertyId": 502,
"MappingId": 0,
"IsVisible": true,
"PackageRequestId": 13818024,
"SortOrder": 3
},
{
"EstimateType": "Trade",
"CarId": 0,
"Id": 10,
"SourceId": 10,
"ServiceId": 12,
"CategoryId": 5,
"Category": "Valuation",
"Description": "Trade Estimate Low",
"Value": 239800.0,
"ServiceResponsePropertyId": 503,
"MappingId": 0,
"IsVisible": true,
"PackageRequestId": 13818024,
"SortOrder": 2
},
{
"Id": 0,
"SourceId": 0,
"ServiceId": 11,
"CategoryId": 7,
"Category": "Report",
"Description": "ReportUrl",
"Value": "https://pdf.lightstoneauto.co.za/Index.aspx?sourceurl=https://cdn.lightstoneauto.co.za/REPORTS/LIVE/ba22673b-0f05-4ae9-b212-0369a7c793ad.html",
"ServiceResponsePropertyId": 0,
"MappingId": 0,
"IsVisible": false,
"PackageRequestId": 0,
"SortOrder": 0
},
{
"Id": 0,
"SourceId": 0,
"ServiceId": 11,
"CategoryId": 7,
"Category": "Report",
"Description": "HtmlUrl",
"Value": "https://cdn.lightstoneauto.co.za/REPORTS/LIVE/ba22673b-0f05-4ae9-b212-0369a7c793ad.html",
"ServiceResponsePropertyId": 0,
"MappingId": 0,
"IsVisible": false,
"PackageRequestId": 0,
"SortOrder": 0
}
]
Below is the class where I display the listview, when I navigate here, it just becomes blank and crashes.
class _ResultsPageState extends State<ResultsPage> {
List<Vehicle> objectList = [];
// Vehicle? objectList;
@override
Widget build(BuildContext context) {
return Center(
child: ListView.builder(
shrinkWrap: true,
itemCount: objectList.length,
itemBuilder: (context, index) {
return Column(
children: [
Padding(
padding: const EdgeInsets.all(10),
child: Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
const Text(
"Make",
// style: Colors.black,
),
Text(objectList[index].value.toString()),
],
),
],
),
)
],
);
},
),
);
}
}
Also below is my model class
class Vehicle {
int? id;
int? sourceId;
int? serviceId;
int? categoryId;
String? category;
String? description;
List<Null>? value;
int? serviceResponsePropertyId;
int? mappingId;
bool? isVisible;
int? packageRequestId;
int? sortOrder;
Vehicle(
{this.id,
this.sourceId,
this.serviceId,
this.categoryId,
this.category,
this.description,
this.value,
this.serviceResponsePropertyId,
this.mappingId,
this.isVisible,
this.packageRequestId,
this.sortOrder});
Vehicle.fromJson(Map<String, dynamic> json) {
id = json['Id'];
sourceId = json['SourceId'];
serviceId = json['ServiceId'];
categoryId = json['CategoryId'];
category = json['Category'];
description = json['Description'];
if (json['Value'] != null) {
value = <Null>[];
json['Value'].forEach((v) {
// value!.add(Null.fromJson(v));
});
}
serviceResponsePropertyId = json['ServiceResponsePropertyId'];
mappingId = json['MappingId'];
isVisible = json['IsVisible'];
packageRequestId = json['PackageRequestId'];
sortOrder = json['SortOrder'];
}
Map<String, dynamic> toJson() {
final Map<String, dynamic> data = Map<String, dynamic>();
data['Id'] = this.id;
data['SourceId'] = this.sourceId;
data['ServiceId'] = this.serviceId;
data['CategoryId'] = this.categoryId;
data['Category'] = this.category;
data['Description'] = this.description;
if (this.value != null) {
data['Value'] = value!.map((v) => toJson()).toList();
}
data['ServiceResponsePropertyId'] = this.serviceResponsePropertyId;
data['MappingId'] = this.mappingId;
data['IsVisible'] = this.isVisible;
data['PackageRequestId'] = this.packageRequestId;
data['SortOrder'] = this.sortOrder;
return data;
}
}
So I want to achieve results like in the screenshot below: