listview - 如何在 Flutter 中使用 ListView 修复 'Bottom Overflowed by XXX pixels'

Question

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

bottom overflowed by 123 pixels

我是 flutter 新手，在学习教程时，我确实包装了第 2 列小部件，其中一个将 2 TextFields() 包装在卡片中，另一个将 height 属性设置为 300，使用 ' 包装 ListView() 小部件Children :' 方法(如果我可以这么说，而不是 ListView.builder())。

我尝试包装在 Expandable() 小部件中，但它仍然存在。只有当高度设置为 100 时，错误才真正消失，但随后我得到了一个很小的可滚动部分。有什么办法可以解决还是这是正常 react ？

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

Flutter: how to fix bottom overflow

这是我的专栏

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

NewTransaction() 包含 TextFields 并且工作正常，

这是我的容器，包装了 ListView(为了可见性，代码已被简化)

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

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

bottom overflowed by 123 pixels.

错误

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,
           ),
         ),
         ],
         ),
       );  `