Flutter - Create dynamic number of texteditingcontrollers

I just modified @Felix's answer with using Map to store TextEditingControllers instead of list. I think its easy to call textEditingControllers with key value pairs. Modified code block;

import 'package:flutter/material.dart';void main() => runApp(MyApp());class MyApp extends StatelessWidget {  @override  Widget build(BuildContext context) {    return MaterialApp(      title: "MyHomePage",      theme: ThemeData(        primarySwatch: Colors.blue,      ),      home: MyHomePage(        title: "MyHomePage",      ),    );  }}class MyHomePage extends StatefulWidget {  MyHomePage({Key key, this.title}) : super(key: key);  final title;  @override  _MyHomePageState createState() => _MyHomePageState();}class _MyHomePageState extends State<MyHomePage> {  @override  Widget build(BuildContext context) {    var stringListReturnedFromApiCall = ["first", "second", "third", "fourth", "..."];    // This list of controllers can be used to set and get the text from/to the TextFields    Map<String,TextEditingController> textEditingControllers = {};    var textFields = <TextField>[];    stringListReturnedFromApiCall.forEach((str) {      var textEditingController = new TextEditingController(text: str);      textEditingControllers.putIfAbsent(str, ()=>textEditingController);      return textFields.add( TextField(controller: textEditingController));    });    return Scaffold(        appBar: AppBar(          title: Text(widget.title),        ),        body: SingleChildScrollView(            child: new Column(              children:[              Column(children:  textFields),                RaisedButton(                  child: Text("Print Values"),                    onPressed: (){                    stringListReturnedFromApiCall.forEach((str){                      print(textEditingControllers[str].text);                    });                  })              ]            )));  }}

when you write something to textfields and hit to print button results ;

flutter: first controller textflutter: second controller textflutter: third controller textflutter: fourth controller textflutter: so on .......

More or less as @Günter Zöchbauer mentioned, you can just build a list of widgets which are nested then in a container.

Here's a simple example:

import 'package:flutter/material.dart';void main() => runApp(MyApp());class MyApp extends StatelessWidget {  @override  Widget build(BuildContext context) {    return MaterialApp(      title: "MyHomePage",      theme: ThemeData(        primarySwatch: Colors.blue,      ),      home: MyHomePage(        title: "MyHomePage",      ),    );  }}class MyHomePage extends StatefulWidget {  MyHomePage({Key key, this.title}) : super(key: key);  final title;  @override  _MyHomePageState createState() => _MyHomePageState();}class _MyHomePageState extends State<MyHomePage> {  @override  Widget build(BuildContext context) {    var stringListReturnedFromApiCall = ["first", "second", "third", "fourth", "..."];    // This list of controllers can be used to set and get the text from/to the TextFields    var textEditingControllers = <TextEditingController>[];    var textFields = <TextField>[];    stringListReturnedFromApiCall.forEach((str) {      var textEditingController = new TextEditingController(text: str);      textEditingControllers.add(textEditingController);      return textFields.add(new TextField(controller: textEditingController));    });    return Scaffold(        appBar: AppBar(          title: Text(widget.title),        ),        body: SingleChildScrollView(            child: new Column(          children: textFields,        )));  }}

Edit: Added list for TextEditingControllers to interact with all the TextFields

Using list of textEditingControllers instead of map

class MyHomePage extends StatefulWidget {  MyHomePage({Key key, this.title}) : super(key: key);  final title;  @override  _MyHomePageState createState() => _MyHomePageState();}class _MyHomePageState extends State<MyHomePage> {  var stringListReturnedFromApiCall = ["first", "second", "third", "fourth", "..."];  List<TextEditingController> textEditingControllers = [];  @override  void initState() {    super.initState();    stringListReturnedFromApiCall.forEach((String str) {      var textEditingController = TextEditingController(text: str);      textEditingControllers.add(textEditingController);    });  }  @override  void dispose() {    super.dispose();    // dispose textEditingControllers to prevent memory leaks    for (TextEditingController textEditingController in textEditingControllers) {      textEditingController?.dispose();    }  }  @override  Widget build(BuildContext context) {    return Scaffold(      appBar: AppBar(        title: Text('title'),      ),      body: ListView.builder(        itemCount: stringListReturnedFromApiCall.length,        itemBuilder: (BuildContext context, int index) {          return Padding(            padding: const EdgeInsets.all(10.0),            child: TextField(              controller: textEditingControllers[index],            ),          );        },      ),    );  }}