如何在 flutter 中添加小部件列表？

Question

I have used the package flutter_form_builder to create list of widget form.

I created a page that enables the user to add as many widget as he wants with the function named _addwidget()

 var _myWidgets = <Widget>[];
 int _index = 0;
 var evaluationOptions = ['1', '2', '3', '4', '5', '6', '7', '8'];
 
 bool autoValidate = true;
 final _formKey = GlobalKey<FormBuilderState>();


 final Map<int, String> nomModulevalues = Map();
 final Map<int, String> evaluationvalues = Map();

 final List<TextEditingController> _nomModuleControllers = [];
 final List<TextEditingController> _evaluationnumber = [];

  void _addwidget() {
   int keyValue = _index;
   _myWidgets = List.from(_myWidgets)
     ..add(Column(
       key: Key("$keyValue"),
       children: <Widget>[
         SizedBox(height: 10),
         Container(
           
           child: Column(
             children: <Widget>[
                  .......
                   Column(
                     children: <Widget>[
                       SizedBox(
                         height: 20,
                       ),
                       _buildnommodule(keyValue),
                       _buildevaluation,
                      ],
                   ),
                 ],
               )
             ],
           ),
         )
       ],
     ));

   setState(() => ++_index);
 }
     
 @override
 Widget build(BuildContext context) {
   return Scaffold(
     appBar: AppBar(
  .....
     floatingActionButton: FloatingActionButton(
       onPressed: () {
         _addwidget();  
   ....
     body: SizedBox(
       height: double.infinity,
       width: double.infinity,
       child: Form(
           autovalidateMode: AutovalidateMode.disabled,
           key: _formKey,
           child: Stack(
        ....
                   Expanded(
                     child: SizedBox(
                       child: ListView(
                         padding: const EdgeInsets.all(10.0),
                         children: _myWidgets,
                     ),
                   ),
                   )],
               )




 Widget _buildnommodule(int keyValue) {
   TextEditingController controller = TextEditingController();
   _nomModuleControllers.add(controller);
   return Container(
     child: FormBuilderTextField(
       name: 'nom',
       controller: controller,
     ),
   );
 }


 Widget _buildevaluation(int keyValue) {
   TextEditingController controller = TextEditingController();
   _evaluationnumber.add(controller);
   return FormBuilder(
     autovalidateMode: AutovalidateMode.disabled,
     child: DropdownButtonHideUnderline(
         child: FormBuilderDropdown(
       name: 'evaluation',
       validator: FormBuilderValidators.compose(
           [FormBuilderValidators.required(context)]),
       items: evaluationOptions
           .map((evaluation) => DropdownMenuItem(
                 value: evaluation,
                 child: Text(
                   evaluation,
                   style: const TextStyle(color: Colors.black),
                   textAlign: TextAlign.center,
                 ),
               ))
           .toList(),
     )),
   );
 }
}

The code works well and is generated as the user wants, but when you start filling out this questionnaire, you notice that the information disappears when moving from one widget to another For example, we create four widgets by pressing four times in the FloatingActionButton,after when filling the first three parts and moving to the fourth, we notice that the information entered in the first and second barriers has disappeared (empty widget)

Answer 1

As i understood the content of your FormFields is disappearing as soon you scroll right?

That's probably a behaviour of the ListView. The ListView automatically disposes the state of the Widgets out of View.

You can try to add this to your ListView:

ListView(
  addAutomaticKeepAlives: true,
),