簡體   English   中英

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

[英]how to add list of widgets in flutter?

我已使用 package flutter_form_builder創建小部件表單列表。

我創建了一個頁面,使用戶可以使用名為 _addwidget() 的 function 添加任意數量的小部件



 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(),
     )),
   );
 }
}

代碼運行良好,根據用戶的需要生成,但是當您開始填寫此問卷時,您會注意到從一個小部件移動到另一個時信息消失了例如,我們通過在 FloatingActionButton 中按四次創建四個小部件,之后當填充前三個部分並移動到第四部分時,我們注意到在第一和第二個障礙中輸入的信息已經消失(空小部件)

據我了解,一旦您向右滾動,您的 FormFields 的內容就會消失?

這可能是 ListView 的一種行為。 ListView 會自動將 Widget 的 state 丟棄到 View 之外。

您可以嘗試將其添加到您的 ListView:

ListView(
  addAutomaticKeepAlives: true,
),

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM