Pageview in flutter/dart is not getting scrollable - flutter

Question

I want to make horizontal scrollable images widget. I placed pageview for that but it is neither working nor I got any error. Don't know what to do.
Map<String, dynamic> documentData = snapshot.data.data();
//List of images
List imageList = documentData["images"];
return ListView(
padding: EdgeInsets.all(0),
children: [
Container(
height: 400,
child: PageView(
children: [
for (var i = 0; i < imageList.length; i++)
Container(
child: Image.network(
"${imageList[i]}",
fit: BoxFit.cover,
))
],
)),

Answer 1

These new containers created in the for loop wasn't added to the list of children. Use spread operator or PageView.builder instead.
Example:
PageView.builder(
itemcount: imageList.length,
itemBuilder:(BuildContext context, int index ){
return Container(
child: Image.network(
"${imageList[index]}",
fit: BoxFit.cover,
));
},
),
OR
PageView(
children: [
for (var i = 0; i < imageList.length; i++)
...[Container(
child: Image.network(
"${imageList[i]}",
fit: BoxFit.cover,
)),]
],
)

Answer 2

This is my whole code. You can check. I just want to make pageview scrollable which is not right now. It doesn't show any error instead.
// import 'dart:html';
import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:e_commerce_app/screens/constants.dart';
import 'package:e_commerce_app/screens/widgets/custom_action_bar.dart';
import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
class ProductPage extends StatefulWidget {
final String productId;
ProductPage({this.productId});
#override
_ProductPageState createState() => _ProductPageState();
}
class _ProductPageState extends State<ProductPage> {
final CollectionReference _productsRef =
FirebaseFirestore.instance.collection("Products");
#override
Widget build(BuildContext context) {
return Scaffold(
body: Stack(
children: [
FutureBuilder(
future: _productsRef.doc(widget.productId).get(),
builder: (context, snapshot) {
if (snapshot.hasError) {
return Scaffold(
body: Center(
child: Text("Error: ${snapshot.error}"),
),
);
}
if (snapshot.connectionState == ConnectionState.done) {
// Firebase DocumentData Map
Map<String, dynamic> documentData = snapshot.data.data();
//List of images
List imageList = documentData["images"];
return ListView(
padding: EdgeInsets.all(0),
children: [
Container(
height: 400,
child: PageView(
children: [
for (var i = 0; i < imageList.length; i++)
Container(
child: Image.network(
"${imageList[i]}",
fit: BoxFit.cover,
))
],
)),
Padding(
padding: const EdgeInsets.only(
top: 24, left: 24, right: 24, bottom: 4),
child: Text(
"${documentData["name"]}",
style: Constants.boldheading,
),
),
Padding(
padding: const EdgeInsets.symmetric(
vertical: 4, horizontal: 24),
child: Text(
"\$${documentData["price"]}",
style: TextStyle(
fontSize: 18,
color: Theme.of(context).accentColor,
fontWeight: FontWeight.w600),
),
),
Padding(
padding: const EdgeInsets.symmetric(
vertical: 4, horizontal: 24),
child: Text(
"${documentData["desc"]}",
style: TextStyle(
fontSize: 16,
),
),
),
Padding(
padding: const EdgeInsets.symmetric(
vertical: 24, horizontal: 24),
child:
Text("Select Size", style: Constants.regularDarkText),
),
],
);
}
return Scaffold(
body: Center(
child: CircularProgressIndicator(),
),
);
}),
CustomActionBar(
hasBackArrow: true,
hasTitle: false,
hasbackground: false,
)
],
));
}
}