flutter - SingleChildScrollView仍然导致屏幕溢出

我有一个使用以下代码构建的简单屏幕。我想一直将广告横幅保持在顶部，而其下方的Container()可以滚动。这就是我将SingleChildScrollView()放在下部容器中的原因。
但是它仍然在屏幕上溢出，并显示以下错误:

════════ Exception caught by rendering library ═════════════════════════════════════════════════════
The following assertion was thrown during layout:
A RenderFlex overflowed by 162 pixels on the bottom.

屏幕如下所示:

body: Container(
        decoration: BoxDecoration(
          image: DecorationImage(
            // colorFilter: ColorFilter.mode(Colors.white, BlendMode.color),
            image: AssetImage("assets/feathers_bg.jpg"),
            fit: BoxFit.cover,
          ),
        ),
        child: Column(
          children: [
            AdmobBanner(
              //below is test id
              adUnitId: 'ca-app-pub-3940256099942544/6300978111',
              adSize: AdmobBannerSize.FULL_BANNER,
            ),
            Padding(
              padding: const EdgeInsets.all(40.0),
              child: SingleChildScrollView(
                child: Container(
                  decoration: BoxDecoration(
                    color: Colors.white,
                    borderRadius: BorderRadius.all(Radius.circular(20)),
                  ),
                  padding: EdgeInsets.all(10),
                  child: Column(
                    children: [
                      Image.network(_birdDetails.thumbnail.source),
                      SizedBox(height: 10,),
                      Container(
                        child: Column(
                          children: [
                            Text(
                              _birdName,
                              textAlign: TextAlign.center,
                              style: TextStyle(
                                fontSize: 20,
                                color: Colors.teal,
                                fontWeight: FontWeight.bold,
                              ),
                            ),
                            Text(
                              _birdDetails.description,
                              textAlign: TextAlign.center,
                              style: TextStyle(
                                fontSize: 14,
                                fontStyle: FontStyle.italic,
                              ),
                            ),
                          ],
                        ),
                      ),
                      SizedBox(height: 20,),
                      Container(
                        padding: EdgeInsets.all(10),
                        decoration: BoxDecoration(
                          color: Colors.grey.shade300,
                          borderRadius: BorderRadius.all(Radius.circular(20)),
                        ),
                        child: Text(
                          _birdDetails.extract,
                          textAlign: TextAlign.justify,
                          style: TextStyle(
                            fontSize: 16
                          ),
                        ),
                      ),
                      SizedBox(height: 10,),

                    ],
                  ),
                ),
              ),
            ),
          ],
        ),
      ),

最佳答案

TL; DR版本。您的SingleChildScrollView需要展开(您可以将Expanded-> Padding-> SingleChildScrollView放入)。
您可以在official documentation中阅读更长的版本，本节描述了类似的情况:

这是您的代码的简化版本，可以轻松重现(例如粘贴并在dartpad中运行):

import 'package:flutter/material.dart';
import 'dart:math';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'SO Question : 64200763'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);
  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  StringBuffer birdDetails;
  var rng = new Random();
  @override
  initState(){
    super.initState();
    birdDetails = new StringBuffer();
    for(int i=0; i<4000; i++){
      birdDetails.write(String.fromCharCode(rng.nextInt(25) + 97));
      if(rng.nextBool() && rng.nextBool()) birdDetails.write(' ');
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Container(
        decoration: BoxDecoration(
          color: Colors.green[400],
          borderRadius: BorderRadius.all(Radius.circular(20)),
        ),
        child: Column(
          children: [
            Container(
              height: 100,
              width: double.maxFinite,
              color: Colors.yellow,
              child: Text('Ad placeholder', textAlign: TextAlign.center)
            ),
            Expanded(
              child: Padding(  // Here is your fix, place expanded above the SingleChildScrollView
              padding: const EdgeInsets.all(40.0),
                child: SingleChildScrollView(
                  child: Container(
                    decoration: BoxDecoration(
                      color: Colors.white,
                      borderRadius: BorderRadius.all(Radius.circular(20)),
                    ),
                    padding: EdgeInsets.all(10),
                    child: Column(
                      children: [
                        Image.network('https://picsum.photos/id/1024/512/288'),
                        SizedBox(height: 10,),
                        Container(
                          child: Column(
                            children: [
                              Text(
                                'Bird name',
                                textAlign: TextAlign.center,
                                style: TextStyle(
                                  fontSize: 20,
                                  color: Colors.teal,
                                  fontWeight: FontWeight.bold,
                                ),
                              ),
                              Text(
                                'Bird (random) description',
                                textAlign: TextAlign.center,
                                style: TextStyle(
                                  fontSize: 14,
                                  fontStyle: FontStyle.italic,
                                ),
                              ),
                            ],
                          ),
                        ),
                        SizedBox(height: 20,),
                        Container(
                          padding: EdgeInsets.all(10),
                          decoration: BoxDecoration(
                            color: Colors.grey.shade300,
                            borderRadius: BorderRadius.all(Radius.circular(20)),
                          ),
                          child: Text(
                            birdDetails.toString(),
                            textAlign: TextAlign.justify,
                            style: TextStyle(
                              fontSize: 16
                            ),
                          ),
                        ),
                        SizedBox(height: 10,),
                      ],
                    ),
                  ),
                ),
              ),
            ),
          ],
        ),
      ),

    );
  }
}

最终结果(根据您如何组织小部件，但没有溢出):

PS，在发布问题之前，我强烈建议剥离/替换一些用户可能拥有或可能不拥有的所有依赖项(如AdMob)，不必要的 Assets (如AssetImage)以及最后未在问题中定义的类结构的代码(例如birdDetails.thumbnail.source)。它可能会帮助您自己调试问题，如果不能解决，那么对于试图帮助您的人们来说，它会变得更容易；)。