Flutter 如何将ListView放在带有填充的脚手架下？

我对flutter还很陌生，我一直在尝试为我的应用程序设置一个个人资料页面，但似乎我不太明白这些flutter小部件是如何组合在一起的，如果我的问题很愚蠢，我很抱歉，但我一直在谷歌上搜索，无法让它正常工作。所以基本上我有一个脚手架，里面有一个容器，用来显示配置文件信息（电子邮件、名称等），我想在它下面放一个列表视图，但颤振一直困扰着我的头脑，我似乎不明白布局是如何协同工作的，这是我的代码。当我尝试执行buildPage（）时，我得到一个错误，即脚手架的大小是无限的，仅使用buildBox（）就可以工作。我不知道该怎么办。谢谢你的帮助

    import 'package:flutter/material.dart';

    class ProfileBox extends StatefulWidget {
      final String userEmail;
      const ProfileBox(this.userEmail);

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

    class _ProfileBoxState extends State<ProfileBox> {


      @override
      Widget build(BuildContext context) {
       return _buildPage();
      }



      Widget _buildBox(){
     return Scaffold(
          body: Align(
            alignment: Alignment.topCenter,
            child: LayoutBuilder(
              builder: (BuildContext context, BoxConstraints constraints) {
                return Container(
                      margin: const EdgeInsets.only(top: 20.0),
                      decoration: BoxDecoration(
                      color: Color(0xFF8185E2), border: Border.all(
                      color: Color(0xFF8185E2),
                      ),
                      borderRadius: BorderRadius.all(Radius.circular(20))
                      ),
                  height: constraints.maxHeight / 2.5,
                  width: MediaQuery.of(context).size.width -  (MediaQuery.of(context).size.width * 5)/100,
                   child: Center(
            child: Text(
             widget.userEmail,
              textAlign: TextAlign.center,
            ),
          ),
                );
              },
            ),
          ),
        );
      }


      Widget _buildPage()
      {
        return Column(children: <Widget>[
          _buildBox(),
          _buildList(),

        ],);

      }

      Widget _buildList()
      {
         return ListView(
            children: <Widget>[
              ListTile(
                title: Text('Sun'),
              ),
              ListTile(
                title: Text('Moon'),
              ),
              ListTile(
                title: Text('Star'),
              ),
            ],
          );
      }

}

导入“包装：颤振/材料.省道”；
类ProfileBox扩展了StatefulWidget{
最终字符串userEmail；
const ProfileBox（this.userEmail）；
@凌驾
_ProfileBoxState createState（）；
}
类_ProfileBoxState扩展状态{
@凌驾
小部件构建（构建上下文）{
返回_buildPage（）；
}
小部件_buildBox（）{
返回脚手架(
主体：对齐(
对齐：alignment.topCenter，
子：布局生成器(
生成器：（BuildContext上下文，BoxConstraints）{
返回容器(
边距：仅限常量边集（顶部：20.0），
装饰：盒子装饰(
颜色：颜色（0xFF8185E2），边框：border.all(
颜色：颜色（0xFF8185E2），
),
边界半径：边界半径。全部（半径。圆形（20））
),
高度：constraints.maxHeight/2.5，
宽度：MediaQuery.of（context）.size.width-（MediaQuery.of（context）.size.width*5）/100，
儿童：中心(
子：文本(
widget.userEmail，
textAlign:textAlign.center，
),
),
);
},
),
),
);
}
小部件_buildPage（）
{
返回列（子项：[
_buildBox（），
_buildList（），
],);
}
小部件_buildList（）
{
返回列表视图(
儿童：[
列表砖(
标题：文本（“Sun”），
),
列表砖(
标题：文本（“月亮”），
),
列表砖(
标题：文本（‘星’），
),
],
);
}
}

Scaffold

小部件应该是包含

列

小部件和所有子部件的顶部小部件。我认为您可以开始学习如何在颤振中布局小部件，以便更好地了解小部件的工作方式，好的地方可以是：

回到你的问题上来，你只需稍加修改即可：

class _ProfileBoxState extends State<ProfileBox> {
  @override
  Widget build(BuildContext context) {
    return _buildPage();
  }

  Widget _buildBox() {
    return Align(
      alignment: Alignment.topCenter,
      child: LayoutBuilder(
        builder: (BuildContext context, BoxConstraints constraints) {
          return Container(
            margin: const EdgeInsets.only(top: 20.0),
            decoration: BoxDecoration(
                color: Color(0xFF8185E2),
                border: Border.all(
                  color: Color(0xFF8185E2),
                ),
                borderRadius: BorderRadius.all(Radius.circular(20))),
            height: constraints.maxHeight / 2.5,
            width: MediaQuery.of(context).size.width -
                (MediaQuery.of(context).size.width * 5) / 100,
            child: Center(
              child: Text(
                widget.userEmail,
                textAlign: TextAlign.center,
              ),
            ),
          );
        },
      ),
    );
  }

  Widget _buildPage() {
    return Scaffold(
      body: Column(
        children: <Widget>[
          _buildBox(),
          _buildList(),
        ],
      ),
    );
  }

  Widget _buildList() {
    return ListView(
      children: <Widget>[
        ListTile(
          title: Text('Sun'),
        ),
        ListTile(
          title: Text('Moon'),
        ),
        ListTile(
          title: Text('Star'),
        ),
      ],
    );
  }
}

class\u ProfileBoxState扩展状态{
@凌驾
小部件构建（构建上下文）{
返回_buildPage（）；
}
小部件_buildBox（）{
返回对齐(
对齐：alignment.topCenter，
子：布局生成器(
生成器：（BuildContext上下文，BoxConstraints）{
返回容器(
边距：仅限常量边集（顶部：20.0），
装饰：盒子装饰(
颜色：颜色（0xFF8185E2），
边界：边界(
颜色：颜色（0xFF8185E2），
),
borderRadius:borderRadius.all（半径.圆形（20）），
高度：constraints.maxHeight/2.5，
宽度：MediaQuery.of（上下文）.size.width-
（MediaQuery.of（context）.size.width*5）/100，
儿童：中心(
子：文本(
widget.userEmail，
textAlign:textAlign.center，
),
),
);
},
),
);
}
小部件_buildPage（）{
返回脚手架(
正文：专栏(
儿童：[
_buildBox（），
_buildList（），
],
),
);
}
小部件_buildList（）{
返回列表视图(
儿童：[
列表砖(
标题：文本（“Sun”），
),
列表砖(
标题：文本（“月亮”），
),
列表砖(
标题：文本（‘星’），
),
],
);
}
}

Scaffold

小部件应该是包含

列

小部件和所有子部件的顶部小部件。我认为您可以开始学习如何在颤振中布局小部件，以便更好地了解小部件的工作方式，好的地方可以是：

回到你的问题上来，你只需稍加修改即可：

class _ProfileBoxState extends State<ProfileBox> {
  @override
  Widget build(BuildContext context) {
    return _buildPage();
  }

  Widget _buildBox() {
    return Align(
      alignment: Alignment.topCenter,
      child: LayoutBuilder(
        builder: (BuildContext context, BoxConstraints constraints) {
          return Container(
            margin: const EdgeInsets.only(top: 20.0),
            decoration: BoxDecoration(
                color: Color(0xFF8185E2),
                border: Border.all(
                  color: Color(0xFF8185E2),
                ),
                borderRadius: BorderRadius.all(Radius.circular(20))),
            height: constraints.maxHeight / 2.5,
            width: MediaQuery.of(context).size.width -
                (MediaQuery.of(context).size.width * 5) / 100,
            child: Center(
              child: Text(
                widget.userEmail,
                textAlign: TextAlign.center,
              ),
            ),
          );
        },
      ),
    );
  }

  Widget _buildPage() {
    return Scaffold(
      body: Column(
        children: <Widget>[
          _buildBox(),
          _buildList(),
        ],
      ),
    );
  }

  Widget _buildList() {
    return ListView(
      children: <Widget>[
        ListTile(
          title: Text('Sun'),
        ),
        ListTile(
          title: Text('Moon'),
        ),
        ListTile(
          title: Text('Star'),
        ),
      ],
    );
  }
}

class\u ProfileBoxState扩展状态{
@凌驾
小部件构建（构建上下文）{
返回_buildPage（）；
}
小部件_buildBox（）{
返回对齐(
对齐：alignment.topCenter，
子：布局生成器(
生成器：（BuildContext上下文，BoxConstraints）{
返回容器(
边距：仅限常量边集（顶部：20.0），
装饰：盒子装饰(
颜色：颜色（0xFF8185E2），
边界：边界(
颜色：颜色（0xFF8185E2），
),
borderRadius:borderRadius.all（半径.圆形（20）），
高度：constraints.maxHeight/2.5，
宽度：MediaQuery.of（上下文）.size.width-
（MediaQuery.of（context）.size.width*5）/100，
儿童：中心(
子：文本(
widget.userEmail，
textAlign:textAlign.center，
),
),
);
},
),
);
}
小部件_buildPage（）{
返回脚手架(
正文：专栏(
儿童：[
_buildBox（），
_buildList（），
],
),
);
}
小部件