Как исправить форму, которая не прокручивается

Я делаю форму, но не могу сделать ее прокручиваемой, она просто работает на краю «окна», но не внутри формы, и я сделал это с помощью последнего X = TextFormField, потому что это единственный способ проверить информацию перед отправкой, это мой код:

I have all the Q's like this:

final usuarioForm = TextFormField(
controller: _idusuarioController,
validator: (value) {
if (value.isEmpty) return 'Llenar campo de Usuario';
return null;
},
style: TextStyle(fontSize: 17.0, color: Colors.deepOrangeAccent),
decoration: InputDecoration(
icon: Icon(Icons.person),
labelText: 'Usuario',
),
);

Моя форма такая:

 final vuelosForm = Form(
      key: _formKey,
      child: ListView(
        shrinkWrap: true,
        scrollDirection: Axis.vertical,
        padding: EdgeInsets.all(10),
        children: [
          usuarioForm,
        ],
      ),
    );

и мой эшафот вот так:

return Scaffold(
      key: _scaffoldKey,
      resizeToAvoidBottomPadding: false,
      appBar: AppBar(
        title: Text('Vuelos'),
        backgroundColor: Colors.deepOrangeAccent,
      ),
      body: Container(
        child: ListView(
          shrinkWrap: true,
          padding: EdgeInsets.fromLTRB(10.0, 0.0, 10.0, 0.0),
          children: [
            Center(
              child: Card(
                elevation: 18.0,
                child: Container(
                  padding: EdgeInsets.all(10.0),
                  child: Column(
                    children: [
                      vuelosForm,
                    ],
                  ),
                ),
              ),
            ),
          ],
        ),
      ),
    );

очевидно, у меня есть еще вопросы, но я не вставляю их сюда, потому что это будет много кода.


person iEduuardo    schedule 28.01.2021    source источник
comment
Похоже, вы используете два listView, вы можете удалить один из них.   -  person Sam Chan    schedule 28.01.2021
comment
Я пробовал, но это не работает или я не знаю, как это сделать правильно   -  person iEduuardo    schedule 28.01.2021
comment
Я до сих пор не понимаю, зачем вам два listView, но не могли бы вы установить размер Form?   -  person Sam Chan    schedule 28.01.2021
comment
это моя идея: поскольку мне нужно проверить текст из поля, мне нужно было разделить все поля, а затем присоединиться к окончательному x = Form (); использовать ключ: _formKey. которому нужен ListView, чтобы отображать мои вопросы. и эта форма должна находиться в части эшафота с телом ›child› child ›children.   -  person iEduuardo    schedule 28.01.2021
comment
Не могли бы вы установить размер списка из последнего x = TextFormField? Получить размер может сделать его прокручиваемым, когда его дочерние элементы больше.   -  person Sam Chan    schedule 28.01.2021


Ответы (3)


Добавление в ответ @Shubham Narkhede. Если вы хотите создать форму, используйте flutter_form_builder пакет с SingleChildScrollView

Этот пакет помогает создавать большие формы во Flutter, удаляя шаблон, необходимый для создания формы, проверки полей, реакции на изменения и сбора окончательного ввода пользователя.

В файле pubspec.ymal добавьте зависимость, например:

dependencies:
flutter_form_builder: ^3.8.2

После добавления зависимости выполните следующую команду:

flutter pub get

Импортируйте пакет в ваш .dart файл:

import 'package:flutter_form_builder/flutter_form_builder.dart';

Вы можете добавить эти поля формы в качестве виджетов ввода


Теперь вы можете использовать FormBuilder как виджет в своем коде:

@override
Widget build(BuildContext context) {

 return Scaffold(
  appBar: AppBar(
    title: Text(formName, style: TextStyle(fontWeight: FontWeight.bold),),
  ),
  body: Container(
    child: Center(
      child: Container(
            child: SingleChildScrollView(
              child: Column(
                children: <Widget>[
                  FormBuilder(
                    key: _fbKey,
                    autovalidate: _autoValidate,
                    child: Column(
                      children: bind your form fields,
                    )
                  )
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }
person Android Player_Shree    schedule 28.01.2021

В вашем коде вы оборачиваете виджет столбца с помощью Listview, поэтому я удаляю только Listview widget и просто оборачиваю столбец с SingleChildScrollView для прокрутки

Container(
        child: Card(
          elevation: 18.0,
          child: Container(
              padding: EdgeInsets.all(10.0),
              child: SingleChildScrollView(
                child: Column(
                  children: [
                    vuelosForm,
                  ],
                ),
              )l̥
          ),
        ),
      ),
person Shubham Narkhede    schedule 28.01.2021

Насколько я понимаю ваш вопрос, вы можете добавить одну строку в свой код, чтобы сделать ее прокручиваемой в ListView вашего виджета Form:

physics: NeverScrollableScrollPhysics(),

Полный код вашей формы:

final vuelosForm = Form(
    child: ListView(
      physics: NeverScrollableScrollPhysics(),
      shrinkWrap: true,
      scrollDirection: Axis.vertical,
      padding: EdgeInsets.all(10),
      children: [
        usuarioForm,
      ],
    ),
  );
person siddhartha sapkota    schedule 07.07.2021