listview.separated flutter showing blank page even it has data - flutter

Question

hi I am new to flutter and dart, i have this issue that the page is showing no data , even though there is data inside listView.seperator , when i check with dubugger , i get data in snapshot.data[index].finishedProductId Or finishedProductName or categoryShortName, but debugger finish it shows blank page, even deleting all i just but Text , still it shows blank page i am giving the code, plz help me. i am giving my code as below thanks in advance. I have marked my website link with start , just for security. Sorry for this.
import 'package:flutter/material.dart';
import 'dart:async';
import 'dart:convert';
import 'package:http/http.dart' as http;
class DetailsPage extends StatefulWidget {
final String itemCode;
DetailsPage({Key key, this.itemCode}) : super(key: key);
#override
_DetailsPageState createState() => _DetailsPageState();
}
class _DetailsPageState extends State<DetailsPage> {
// ignore: missing_return
Future<List<ItemDetails>> _getItemDetails() async {
final response = await http.get(
'https://www.****.com/appfiles/getprodcontent.php?getContent=' +
this.widget.itemCode );
var jsonData = jsonDecode(response.body);
print(jsonData);
List<ItemDetails> itemDet = [];
for (var it in jsonData) {
ItemDetails iDet = ItemDetails(
it['imgPath'],
it['finishedProductId'],
it["finishedProductName"],
it["categoryShortName"],
);
itemDet.add(iDet);
}
print(itemDet.length);
return itemDet;
}
#override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.blueGrey[200],
appBar: AppBar(
title: Text("Product Details of " + this.widget.itemCode),
),
body: Container(
child: FutureBuilder(
initialData: [],
future: _getItemDetails(),
// ignore: missing_return
builder: (BuildContext context, AsyncSnapshot snapshot) {
//if(snapshot.connectionState == ConnectionState.done){
//if (snapshot.data == null) {
// return Container(
// child: Center(
// child: Text('Loading...'),
/// ));
// } else {
return Column(
children: <Widget> [
SizedBox(
height:200,
child: ListView.seperated(
padding: const EdgeInsets.all(8),
itemCount: snapshot.data.length,
// ignore: missing_return
itemBuilder: (BuildContext context, int index) {
Container (
child:
Center(child: Text("finished product id") ,),
);
Container(
height: 50,
color: Colors.amber[200],
child: Center(
child: CircleAvatar(
radius: 50.0,
backgroundImage: NetworkImage(
"https://www.shardaudyogmandir.com/assets/thumbs/javaschatni.png")
!= null ?NetworkImage("https://www.****.com/assets/thumbs/***.png") : Container() ,
),
),
);
Container(
height: 50,
color: Colors.amber[200],
child: Center(
child: Text(snapshot.data[index].finishedProductId != null ? snapshot.data[index].finishedProductId: "",
style: TextStyle(
color: Colors.black,
fontSize: 20,
fontWeight: FontWeight.bold)),
),
);
Container(
height: 50,
color: Colors.amber[200],
child: Center(
child: Text(snapshot.data[index].finishedProductName != null ? snapshot.data[index].finishedProductName: "",
style: TextStyle(color: Colors.black)),
),
);
Container(
height: 50,
color: Colors.amber[200],
child: Center(
child: Text(snapshot.data[index].categoryShortName != null ? snapshot.data[index].categoryShortName : "",
style: TextStyle(color: Colors.black)),
),
);
Container(
height: 50,
color: Colors.amber[200],
child: Center(
child: RaisedButton(
color: Colors.green[700],
onPressed: () {
//print("press view details");
},
child: const Text('Add To Cart',
style: TextStyle(
fontSize: 20,
color: Colors.white)),
),
),
);
},
//separatorBuilder: (BuildContext context, int index) =>
//const Divider(),
),
)
],
);
//}
//}
}
)
),
);
}
}
class ItemDetails {
final String finishedProductId;
final String finishedProductName;
final String categoryShortName;
//final String rawMaterialName;
final String imgPath;
ItemDetails(this.imgPath, this.finishedProductId, this.finishedProductName,
this.categoryShortName);
}

Answer 1

You need to add return inside Item Builder method like this :
itemBuilder: (BuildContext context, int index) {
return Column(
children: [
Container(
height: 50,
color: Colors.amber[200],
child: Center(
child: CircleAvatar(
radius: 50.0,
backgroundImage: NetworkImage(
"https://www.******.com/assets/thumbs/****.png")
!= null ?NetworkImage("https://www.shardaudyogmandir.com/assets/thumbs/javaschatni.png") : Container() ,
),
),
),
Container (
child:
Center(child: Text("finished product id") ,),
),
Container(
height: 50,
color: Colors.amber[200],
child: Center(
child: Text(snapshot.data[index].finishedProductId != null ? snapshot.data[index].finishedProductId: "",
style: TextStyle(
color: Colors.black,
fontSize: 20,
fontWeight: FontWeight.bold)),
),
),
Container(
height: 50,
color: Colors.amber[200],
child: Center(
child: Text(snapshot.data[index].finishedProductName != null ? snapshot.data[index].finishedProductName: "",
style: TextStyle(color: Colors.black)),
),
),
Container(
height: 50,
color: Colors.amber[200],
child: Center(
child: Text(snapshot.data[index].categoryShortName != null ? snapshot.data[index].categoryShortName : "",
style: TextStyle(color: Colors.black)),
),
),
Container(
height: 50,
color: Colors.amber[200],
child: Center(
child: RaisedButton(
color: Colors.green[700],
onPressed: () {
//print("press view details"),
},
child: const Text('Add To Cart',
style: TextStyle(
fontSize: 20,
color: Colors.white)),
),
),
),
],
);
},
And wrap it inside column. I don't know how the UI will be look like but that's the problem from your code. For further information head on Flutter.Dev