dart 如何在Flutter中创建可滚动的表单

0tdrvxhp 于 9个月前发布在 Flutter

关注(0)|答案(3)|浏览(139)

所以我试图做一个应用程序，让用户填写几个表单字段，并在用户提交表单时处理信息。我的问题是，我似乎找不到如何使Form滚动（因为它很长，会导致RenderFlex错误）.任何我 Package 它的可滚动小部件仍然会导致RenderFlex错误。唯一一次滚动是当我用ListView Package 它时，但它也会导致RenderFlex错误，最糟糕的是，由于某种原因，当我试图滚动到底部点击按钮提交时，滚动回到正常状态。我已经尝试了How to scroll page in flutter和Flutter - How to make a column screen scrollable中的大多数解决方案，但似乎没有一个有效。下面是表单的结构：

- 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)

字符串
我希望这是足够的信息，我真的很感激，如果有人可以帮助我使这个形式滚动。提前感谢！

dart

来源：https://stackoverflow.com/questions/72447031/how-to-make-a-form-scrollable-in-flutter

3条答案

按热度按时间

x7rlezfr1#

问题是当你使用Column时，如果没有指定高度，它会认为高度是无限的。试着用SizedBox Package 第一个列小部件，并使用MediaQuery来确定屏幕高度，并将其设置为SizedBox的高度参数。
现在，使用SingleChildScrollView Package Column，使其可滚动。
例如，

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

字符串
最后，为什么需要第二个列来放置文本和输入字段？不能直接使用TextField（）中的InputDecoration方法，然后使用labelText或HelperText吗

赞(0）回复(0）举报 9个月前

zy1mlcev2#

您可以使用SingleChildScrollView Widget。

赞(0）回复(0）举报 9个月前

exdqitrt3#

您可以使用SingleChildScrollView并使用Container小部件 Package 它，并为其提供一定的高度。

赞(0）回复(0）举报 9个月前

我来回答

dart 如何在Flutter中创建可滚动的表单

3条答案

相关问题

热门标签

最新问答