Question

我在固定高度为300的容器中使用ListView（children：[]），但是当软键盘打开时，出现底部溢出错误。

底部溢出123个像素

我是新手，在学习本教程时，我确实在第2栏中包装了一个小部件，一个在卡片中包装了2个TextFields（），另一个将height属性设置为300，使用' children：'方法（如果可以这样说，而不是ListView.builder（））。

我尝试用Expandable（）小部件包装，但它仍然存在。仅当高度设置为100时，错误实际上消失了，但是随后我得到了一个很小的可滚动部分。有什么办法可以解决还是这是正常的反应？

注意：我还尝试了此处显示的适用于我的情况的所有解决方案，但没有一个对我有用。

Flutter: how to fix bottom overflow

这是我的专栏

 return Column(
      children: <Widget>[
        NewTransaction(_addNewTransaction),
        TransactionList(_userTransaction),
      ],
    );

NewTransaction（）包含TextField，并且工作正常，

这是我包装ListView的容器（代码经过简化以提高可见性）

return Container(
      height: 300,
      child: ListView(
          children: [
               Container(
                   height: 200,
               ),
               Container(
                   height: 200,
               ),
               Container(
                   height: 200,
               ),
               Container(
                   height: 200,
               ),
          ],
      ),
);

通常，当软键盘打开时，它不应显示任何底部溢出错误，但会显示。在我遵循的教程中，它没有问题，但是随后我得到了

底部溢出123个像素。

错误

Here's a screenshot of the result

Answer 1

为避免底部溢出，请将容器或列包装在SingleChildScrollView小部件内，或者将函数的整个body属性放置在singlechildScrollView中，也可以增加容器的高度。例如：

 `return SingleChildScrollView(
    child: Container(
    height: 300,
      child: ListView(
      children: [
           Container(
               height: 200,
           ),
           Container(
               height: 200,
           ),
           Container(
               height: 200,
           ),
           Container(
               height: 200,
           ),
         ),
         ],
         ),
       );  `

如何在Flutter中使用ListViews修复“底部溢出XXX像素”

1 个答案: