在 Flutter 中使用 ListViewBuilder 中的动态 TextField

Question

我正在尝试在 flutter 中构建一个动态 TextField 列表，但不明白我如何处理它。

我的清单如下：

我的代码结构是：

ListView.builder(
            shrinkWrap: true,
            itemCount: itemList.length,
            itemBuilder: (context, index) {

              if(itemList.length == null) {
                return _buildProgressIndicator();
              } else {
                return singleItemList(index);
              }
          })




Widget singleItemList(int index) {

if((itemList.length -1) < index)
{
  return Container(child: null); 
} else {

  dynamic singleItem = itemList[index];
  String counter = (index+1).toString();

  return 
     Container(

        decoration: BoxDecoration(
          color: Colors.white,
        ),

      child: Row(    

        children:[

          Expanded(
            flex: 1,
            child: Text(counter,style: orderBookItemListCounter(),)
          ),



          Expanded(
            flex: 3,
            child: TextField(
                controller: _addProductToCart(counter),
                decoration: InputDecoration(
                  labelText: "Qty",
                ),
            )
          ),

    ])
  );
}
}

1. 我的产品列表未修复可能会更改产品数量，
2. 我想根据产品 ID 捕获数量。

谢谢 ：）

Answer 1

您有多种选择，具体取决于您构建应用程序的方式或您拥有中央状态的位置。

我在这里建议你一个更新本地地图变量的解决方案。或者，您可以将事件/流发送到您的商店所在的位置。

import 'package:flutter/material.dart';

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  List<Item> itemList = [
    Item("ID1", "First product"),
    Item("ID2", "Second product"),
  ];

  Map<String, int> quantities = {};

  void takeNumber(String text, String itemId) {
    try {
      int number = int.parse(text);
      quantities[itemId] = number;
      print(quantities);
    } on FormatException {}
  }

  Widget singleItemList(int index) {
    Item item = itemList[index];

    return Container(
      decoration: BoxDecoration(
        color: Colors.white,
      ),
      child: Row(
        children: [
          Expanded(flex: 1, child: Text("${index + 1}")),
          Expanded(
            flex: 3,
            child: TextField(
              keyboardType: TextInputType.number,
              onChanged: (text) {
                takeNumber(text, item.id);
              },
              decoration: InputDecoration(
                labelText: "Qty",
              ),
            ),
          ),
        ],
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("Demo")),
      body: Center(
        child: ListView.builder(
            shrinkWrap: true,
            itemCount: itemList.length,
            itemBuilder: (context, index) {
              if (itemList.isEmpty) {
                return CircularProgressIndicator();
              } else {
                return singleItemList(index);
              }
            }),
      ),
    );
  }
}

class Item {
  final String id;
  final String name;

  Item(this.id, this.name);
}

Answer 2

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}



class _MyHomePageState extends State<MyHomePage> {
  List<TextEditingController> _controllers = new List();
  List<Item> itemList = [
    Item("ID1", "product 1"),
    Item("ID2", "product 2"),
    Item("ID3", "product 3"),
    Item("ID4", "product 4"),
    Item("ID5", "product 5"),
    Item("ID6", "product 6"),
    Item("ID7", "product 7"),
    Item("ID8", "product 8"),
    Item("ID9", "product 9"),
    Item("ID10", "product 10"),
    Item("ID11", "product 11"),
    Item("ID12", "product 12"),
    Item("ID13", "product 13"),
    Item("ID14", "product 14"),
    Item("ID15", "product 15"),
    Item("ID16", "product 16"),
    Item("ID17", "product 17"),
    Item("ID18", "product 18"),



  ];



  Map<String, int> quantities = {};

  void takeNumber(String text, String itemId) {
    try {
      int number = int.parse(text);
      quantities[itemId] = number;
      print(quantities);
    } on FormatException {}
  }



  Widget singleItemList(int index, TextEditingController controllertxt) {
    Item item = itemList[index];

    return Container(
      decoration: BoxDecoration(
        color: Colors.white,
      ),
      child: Row(
        children: [


          Expanded(flex: 1, child: Text("${index + 1}")),

          Expanded(
            flex: 3,
            child: new TextField(
              controller: controllertxt,
              keyboardType: TextInputType.number,
              onChanged: (text) {
                takeNumber(text, item.id);
              },
              decoration: InputDecoration(
                labelText: "Qty",
              ),
            ),
          ),
        ],
      ),
    );
  }



  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("Demo")),
      body: Center(
        child: ListView.builder(
            shrinkWrap: true,
            itemCount: itemList.length,
            itemBuilder: (context, index) {
              _controllers.add(new TextEditingController());
              if (itemList.isEmpty) {
                return CircularProgressIndicator();
              } else {

                return singleItemList(index,_controllers[index]);
              }
            }),
      ),
    );
  }
}




class Item {
  final String id;
  final String name;

  Item(this.id, this.name);
}