A RenderFlex overflowed by 620 pixels on the bottom - flutter

Question

******Update ********
Here's the updated body which resolved the scrolling issue as posted earlier below, but now getting A RenderFlex overflowed by 620 pixels on the bottom. I replaced body: listView with body: Column. I know this is very common issue and per the logcat the solution is to wrap the content in Expanded widget. In my case, I would like to know where to use 'Expanded` widget to resolve the issue.
Widget reviewsSection = Container(
child: FutureBuilder(
future: _fetchReviews(),
builder: (context, snapshot) {
if (snapshot.data != null) {
return _buildReviewTiles(snapshot.data);
} else if (snapshot.hasError) {
return Text('${snapshot.error}',
style: TextStyle(color: Colors.black, fontSize: 12.0),
textAlign: TextAlign.justify);
}
// By default, show a loading spinner
return new Container(child: new CircularProgressIndicator());
}));
// Creates a list view based on the reviews in the reviewList.
Widget _buildReviewTiles(List<Review> list) {
return (new Container(
child: ListView.builder(
shrinkWrap: true,
itemCount: reviewList == null ? 0 : reviewList.length,
itemBuilder: (BuildContext context, int index) {
return new Container(
child: Center(
child: Column(children: <Widget>[
_getReviewTile(reviewList[index]),
new Padding(
padding: EdgeInsets.all(5.0),
),
new Divider(
height: 3.0,
color: Colors.black26,
)
])));
}),
));
}
// Returns a list tile representation of a review
Widget _getReviewTile(Review review) {
// Keep only the day, month, and year
var date = review.created.split(" ")[0];
return new Container(
color: Colors.yellow,
child: new Row(
children: <Widget>[
new Expanded(
child: ListTile(
leading: new Column(children: <Widget>[
const Icon(Icons.stars),
]),
subtitle: new Text(
'${review.review}',
style: TextStyle(color: Colors.black, fontSize: 14.0),
),
title: new Row(
children: <Widget>[
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
new Text(date, style: new TextStyle(fontSize: 12.0)),
new Padding(
padding: EdgeInsets.all(4.0),
),
],
),
),
new Row(
crossAxisAlignment: CrossAxisAlignment.end,
children: <Widget>[
new StarRating(
starCount: 5,
rating: review.rating + 0.0,
color: Colors.amber,
),
]),
],
),
),
),
],
),
);
}
This is my Scaffold code that uses reviewsSection along with other sections:
return Scaffold(
body: NestedScrollView(
headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
return <Widget>[
SliverAppBar(
expandedHeight: 200.0,
floating: false,
pinned: true,
flexibleSpace: FlexibleSpaceBar(
background: FadeInImage.assetNetwork(
placeholder: 'assets/header_bg.png',
width: 600.0,
height: 240.0,
fit: BoxFit.cover,
image: 'https:' + pro.profilePhoto),
),
),
];
},
body: Column(
children: <Widget>[
new Container(
color: Colors.black87,
child: Row(
children: <Widget>[
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Padding(
padding: new EdgeInsets.fromLTRB(5.0, 8.0, 10.0, 5.0),
),
new Text(
'${pro.fullname}',
style: TextStyle(fontSize: 18.0, color: Colors.white),
),
new Text(
'${pro.company}',
style: TextStyle(fontSize: 14.0, color: Colors.white),
),
Padding(
padding: EdgeInsets.all(5.0),
)
],
),
),
new Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Padding(
padding: new EdgeInsets.fromLTRB(5.0, 8.0, 10.0, 5.0),
),
new StarRating(
starCount: 5,
rating: pro.rating,
color: Colors.amber,
),
new Text(
'${pro.reviewCount} reviews',
style: TextStyle(fontSize: 14.0, color: Colors.white),
),
Padding(
padding: EdgeInsets.all(5.0),
)
],
),
],
),
),
Padding(
padding: EdgeInsets.all(5.0),
),
buttonSection,
Padding(
padding: EdgeInsets.all(2.0),
),
Divider(color: Colors.black26, height: 0.5),
Padding(
padding: EdgeInsets.all(4.0),
),
experienceSection,
Padding(
padding: EdgeInsets.all(8.0),
),
reviewsSection
],
),
),
);
}

Answer 1

Am re-posting the answer suggested by #anmol.majhail that helped me to resolve the issue.
"Try Wraping - reviewsSection in Expanded.& Remove containers around FutureBuilder & ListViewBuilder"
So corrected reviewsSection code that worked is:
Widget reviewsSection = Expanded(
child: FutureBuilder(
future: _fetchReviews(),
builder: (context, snapshot) {
if (snapshot.data != null) {
return _buildReviewTiles(snapshot.data);
} else if (snapshot.hasError) {
return Text('${snapshot.error}',
style: TextStyle(color: Colors.black, fontSize: 12.0),
textAlign: TextAlign.justify);
}
// By default, show a loading spinner
return Center(child: CircularProgressIndicator());
}));