Die TextFields in ListView.builder verschwinden

Question

Um eine Bestandskontrolle durchzuführen, erstelle ich eine ListView aus Firebase-Daten (eine Liste von "Alimentos") und ein TextField, um die Menge für jedes "Alimento" zu bearbeiten.

Es funktioniert gut, wenn ich weniger als einen Bildschirm mit "Alimentos" habe, aber wenn ich einige Seiten mit "Alimentos" habe, verschwinden meine Textfelder. Ich verstehe, dass dies passiert, weil ListView.builder nur die Elemente erstellt, die sich im oder in der Nähe des Ansichtsfensters befinden (während Sie scrollen), aber ich weiß nicht, wie ich es lösen soll.

Ich habe Textfield in ListView.builder Post gelesen , wo @Ashton Thomas vorschlägt, ein benutzerdefiniertes Widget pro Zeile zu implementieren, aber ich verstehe nicht, wie ich das bekomme.

Dies ist mein ListView.Builder ...

  Widget _crearListado(BuildContext context, AlimentoBloc alimentoBloc) {

    final _size = MediaQuery.of(context).size;

    return Container(
      height: _size.height * 0.5,
      child: StreamBuilder(
          stream: alimentoBloc.alimentoStream ,
          builder: (BuildContext context, AsyncSnapshot<List<AlimentoModel>> snapshot){
            if (snapshot.hasData) {
              List<AlimentoModel> alimentos = snapshot.data;
              alimentos.sort((a, b) => a.proteina.compareTo(b.proteina));
              return Stack(
                children: <Widget>[
                  ListView.builder(
                    itemCount: alimentos.length,
                    itemBuilder: (context, i) { //Esta variable es gráfica, sólo se crea para lo que se está viendo
                      _controlList.add(new ControlInventarioModel());
                      return _crearItem(context, alimentoBloc, alimentos[i], i);
                    },

                    padding: EdgeInsets.only(left: 10.0, right: 10.0, top: 0.0, bottom: 20.0),
                  ),
                ],
              );
            } else {
              return Center (child: Image(image: AssetImage('assets/Aplians-fish-Preloader.gif'), height: 200.0,));
            }
          },
      ),
    );
  }

Jede Zeile hat ein Element (_CrearItem) mit einem TextField am Ende (_cajaNum) wie folgt:

  Widget _crearItem(BuildContext context, AlimentoBloc alimentoBloc, AlimentoModel alimento, int i) {

      return Card(
        color: Colors.grey[200], //color de la tarjeta
        elevation: 0.0, //sin sombra
        shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(15.0)),
        child: ListTile(
            title: Text('${alimento.nombre}', style: TextStyle(color: Theme.of(context).primaryColor, fontSize: 18.0)), subtitle: Text ('${alimento.fabricante}'), //refLoteActual
            onTap: () {},
            leading: Icon(FontAwesomeIcons.shoppingBag, color: Theme.of(context).accentColor),
            trailing: _cajaNum(context, i, alimento.idAlimento),// nuevoControlador),
        ),
      );
  }

  Widget _cajaNum(BuildContext context, int i, String idAlimento){    
    return Container(
      width: 100.0,
      height: 40.0,
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(10.0),
      ),
      child: TextField(
        style: TextStyle(fontSize: 20.0),
        textAlign: TextAlign.center,
        keyboardType: TextInputType.numberWithOptions(),//decimal:false, signed: false),
        inputFormatters: <TextInputFormatter>[
              FilteringTextInputFormatter.allow(RegExp(r'^(\d+)?\.?\d{0,2}')),
              FilteringTextInputFormatter.singleLineFormatter,
            ],
        maxLength: 5,
        onChanged: (value) {
                if(utils.isNumeric(value) && double.parse(value)>=0) {
                  _controlList[i].cantControl = double.parse(value);
                } 
                else {
                  _controlList[i].cantControl = null;
                }
                },
        onEditingComplete: () {
          FocusScope.of(context).unfocus();
        },
        onSubmitted: (value) {
        },
      ),
    ); 
  }

Wie kann ich die Werte von TextFields beibehalten, wenn meine ListView beim Scrollen kontinuierlich neu erstellt wird?

AKTUALISIEREN

Ich füge Screenshots hinzu, die zeigen, dass Textfelder "verschwinden" ...

Answer 1

Eigenschaft hinzufügen TextFormField : initialValue. Es hat bei mir funktioniert, ich habe das auch erlebt.

so was

TextField(
    style: TextStyle(fontSize: 20.0),
    initialValue: _controlList[i].cantControll ?? '0',
    onChanged: (value) {
            if(utils.isNumeric(value) && double.parse(value)>=0) {
              _controlList[i].cantControl = double.parse(value);
            } 
            else {
              _controlList[i].cantControl = null;
            }
            },
    onEditingComplete: () {
      FocusScope.of(context).unfocus();
    },
    onSubmitted: (value) {
    },
  ),

Denn Ihr Textfeld wird neu erstellt, wenn Sie das nächste Texfeld scrollen und eingeben. Ihre Daten sind jedoch bereits in gespeichert _controlList[i].cantControl.