使用按钮单击生成文本字段小部件并保存文本输入颤动

Question

我想在按钮单击时从用户生成文本字段，我想将文本保存在列表中输入的所有字段，默认情况下 2 个字段是必需的

生成字段工作已完成，但 现在的问题是我无法从字段中获取文本输入的值

class Add_Url extends StatefulWidget {
const Add_Url({Key? key}) : super(key: key);

@override
_Add_UrlState createState() => _Add_UrlState();
}

class _Add_UrlState extends State<Add_Url> {

var controller = TextEditingController();

List fields = [0,1];


@override
Widget build(BuildContext context) {

return Scaffold(
  appBar: AppBar(
    backgroundColor: Colors.white,
    centerTitle: true,
    title: const Text(
      "PDF", style: TextStyle(color: Colors.black),),
    iconTheme: IconThemeData(color: Colors.black),
  ),
  body: Padding(
    padding: const EdgeInsets.all(10.0),
    child: Column(
      children: [


        Padding(
          padding: const EdgeInsets.all(10.0),
          child: Center(
            child: Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Text("Add Urls", style: TextStyle(fontSize: 20.sp),),
                SizedBox(width: 1.h,),
                InkWell(
                    onTap:(){

                      setState((){
                        fields.add(fields.length + 1);
                       print(fields);
                      });

                    },
                    child: Icon(Icons.add_circle, color: Colors.blue, size: 25.sp,))
              ],
            ),
          ),
        ),
        SizedBox(height: 2.h,),
        Expanded(
          child: Container(
                child: ListView.builder(
                  itemCount: fields.length,
                  itemBuilder: (BuildContext context, int index){
                    
                    return Padding(
                      padding: const EdgeInsets.all(10),
                      child: Row(
                        children: [
                          Expanded(child:
                          Container(
                            child: TextFormField(
                              controller: controller,
                              decoration: InputDecoration(
                                hintText: "https://yourfile.pdf",
                                hintStyle: TextStyle(
                                    color: const Color(0XFF1D3D9A), fontSize: 14.sp),
                                contentPadding: EdgeInsets.all(8),
                                fillColor: Colors.white70,
                                focusedBorder: OutlineInputBorder(
                                  borderRadius: BorderRadius.circular(15.0),
                                  borderSide: BorderSide(
                                    color: Colors.black,
                                  ),
                                ),
                                enabledBorder: OutlineInputBorder(
                                  borderRadius: BorderRadius.circular(15.0),
                                  borderSide: BorderSide(
                                    color: Colors.black,
                                    width: 1.0,
                                  ),
                                ),
                              ),
                            ),
                          ),
                          ),
                          SizedBox(width: 1.w,),
                          InkWell(
                            onTap: (){


                                if(fields.contains(fields[index])){
                                  setState(() {
                                    fields.removeWhere((val) => val == fields[index]);
                                  });
                                  print(fields);
                                }


                          },
                            child: (fields.length >2 )? Container(
                              child: Icon(
                                Icons.remove_circle,
                                color: Colors.blue,
                                // feilds.contains(feilds[index])? Colors.blue : Colors.grey,
                                size: 22.sp,),
                            ) : Container()
                          ),

                        ],
                      )



                    );
                  },
                )),
        ),
        SizedBox(height: 3.h,),
        ElevatedButton(
          onPressed: ()  {

            print(controller.text);


          },
          child: Text("Done"),
          style: ElevatedButton.styleFrom(
              minimumSize: Size(30.w, 5.h),
              primary: Colors.blue,
              // const Color(0xFF5963FF),
              textStyle: const TextStyle(
                fontSize: 15,
                fontWeight: FontWeight.bold,
                  )),
                     ),


                   ],
                 ),
               ),
           );
         }
          }

我想获取列表中的每个新文本字段值 请任何人帮助我 谢谢你

Answer 1

先做一个这样的模型类

    class TextFieldClass{
      TextEditingController controller = new TextEditingController();
      var hint;
    
      TextFieldClass({this.controller,this.hint});
    }

然后你只需要制作一个列表视图并在任何你想要的地方调用一个小部件函数，就像这样

      List<TextFieldClass> textFields = [];
    
      Widget list(){
        return Container(
          padding:EdgeInsets.symmetric(vertical: 10),
          
          child: ListView.builder(
              physics: NeverScrollableScrollPhysics(),
              shrinkWrap: true,
              itemCount: textFields.length,
              itemBuilder: (context,index){
                return Padding(
                    padding: EdgeInsets.symmetric(vertical: 5),
    
                    child:TextFormField(
                      controller: textFields[index].controller,
                      decoration: InputDecoration(
                        hintText:textFields[index].hint,
                      ),
                    )
                );
              }),
        );
      }

现在你只需要在列表中添加项目的最后一部分 例如，您制作一个添加按钮，并在添加按钮的 onTap 函数中编写

 textFields.add(TextFieldClass(
  controller: newController,
  hint: 'new field'
));

您的价值将在这里 ====> textFields[anyIndex].controller