无法将 ListView 设置为 LayoutBuilder 小部件(Flutter)

And*_*huk 5 dart flutter

我需要有这样的结构

在此处输入图片说明

LayoutBuilder用来获取内容的高度(在App Bar和之间TabsBottomNavigation)。在这里,我构建 Profile Info Container 并希望使用一些 List Tiles 构建 ListView,但是当我尝试在 Layout Builder 中构建它时,我在控制台中出现错误。

在此处输入图片说明

如果我创造ListView出来LayoutBuilder它的作品!

请帮我解决它。我的代码如下:

Widget build(BuildContext context) {
    return LayoutBuilder(
      builder: (BuildContext context, BoxConstraints viewportConstraints) {
        return SingleChildScrollView(
          child: Container(
            child: Column(
              children: <Widget>[
                Container(
                  height: viewportConstraints.maxHeight * .44,
                  color: Theme.of(context).primaryColor,
                  padding: EdgeInsets.only(bottom: 2),
                  child: Align(
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: <Widget>[
                        _buildProfileImage(context),
                        SizedBox(height: 17),
                        Text(userName)
                      ],
                    ),
                  ),
                ),
                Expanded(
                  child: ListView(
                    children: <Widget>[
                      ListTile(
                        leading: Icon(Icons.print),
                        title: Text('asdad'),
                      )
                    ],
                  ),
                )
              ],
            ),
          ),
        );
      },
    );
  }
Run Code Online (Sandbox Code Playgroud)

Pra*_*iya 4

使用下面的build方法将适用于您的情况。(我已经检查过并且它正在工作,所以我希望它也适用于您的情况并且符合您的要求。)

Widget build(BuildContext context) {
    return LayoutBuilder(
      builder: (BuildContext context, BoxConstraints viewportConstraints) {
        return Container(
          child: Column(
            children: <Widget>[
              Container(
                height: viewportConstraints.maxHeight * .44,
                color: Theme.of(context).primaryColor,
                padding: EdgeInsets.only(bottom: 2),
                child: Align(
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: <Widget>[
                      _buildProfileImage(context),
                      SizedBox(height: 17),
                      Text(userName),
                    ],
                  ),
                ),
              ),
              SizedBox(height: 16),
              Flexible(
                child: ListView(
                  children: <Widget>[
                    Card(
                      child: ListTile(
                        leading: Icon(Icons.print),
                        title: Text('asdad'),
                      ),
                    ),
                  ],
                ),
              ),
            ],
          ),
        );
      },
    );
  }
Run Code Online (Sandbox Code Playgroud)

我认为SingleChildScrollView在这种情况下没有用,所以我将其删除,但如果您填写的话可以使用它。

您仍然需要根据您的意愿进行一些 UI 改进,因为这是根据您的要求的基本结构。

希望对你有帮助。