A RenderFlex 在底部溢出 620 像素

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());
            }));