如何使窗体在颤振中可滚动

Question

所以我试图使一个应用程序，我让用户填写一对表单字段和处理信息时，用户提交的表单。我的问题是，我似乎无法找出如何使Form可滚动(因为它很长，导致RenderFlex错误)。我包装它的任何可滚动小部件仍然会导致RenderFlex错误。它滚动的唯一时间是当我用ListView包装它，但它也会导致RenderFlex错误，最糟糕的是，由于某种原因，当我试图滚动到底部点击按钮提交时，它会滚动回正常状态。我已经尝试了如何在flutter和flutter中滚动页面的大多数解决方案-如何使列屏幕可滚动，但它们似乎都不起作用。下面是表单的结构:

- Form
- Column (List of input fields, crossAxisAlignment = CrossAxisAlignment.start)
- Padding (Input field, top padding of 12)
- Column (Text + input field)
- Align (alignment = Alignment.centerLeft)
- Padding (Left padding 8)
- Text (Field title)
- Padding (Symmetric horizontal padding of 8)
- TextFormField (Text input)
- Seven more input fields with the same structure (Padding > Column > Align > ...)
- Padding (Vertical padding of 64)
- Align (center alignment)
- FractionallySizedBox (for 75% width)
- SizedBox (for fixed height)
- ElevatedButton (Submit button)
- Text (Submit button text)

我希望这是足够的信息，如果有人能帮助我使这个表单可滚动，我将非常感激。提前感谢!

Answer 1

问题是当你使用Column在不指定高度的情况下，它认为高度是无限的。尝试用sizebox包装第一个列小部件并使用MediaQuery确定屏幕高度，并将其设置为sizebox的高度参数。.

现在，换行列有一个SingleScrollChildView

使其可滚动 例如,

SizedBox(
height: MediaQuery.of(context).size.height,
child: SingleScrollChildView(
child: Column(...),
),
),

最后，为什么需要第二个列文本和输入字段?你不能直接使用InputDecorationTextField()并使用labelText或HelperText

Answer 2

您可以使用SingleChildScrollView Widget。

Answer 3

您可以使用SingleChildScrollView并将其包裹在Container小部件中，并为其提供一定的高度。