Question

嗨，我是新来的人

我正在创建一个地址StatefulWidget，用户可以在其中输入任意数量的地址。目前，我正在实现删除项逻辑，但也许我做错了什么。小部件如下所示：

我将ListViewBuilder与一系列小部件一起使用，这是代码：

class TestPage2 extends StatefulWidget {
  @override
  _TestPage2State createState() => _TestPage2State();
}

class _TestPage2State extends State<TestPage2> {
  List<Widget> lwidgets = [];

  @override
  void initState() {
    lwidgets.insert(
        lwidgets.length,
        _Adresses(
            indice: 0, onDeleteAdress: (int i) => {deleteItemFromList(0)}));
    lwidgets.insert(lwidgets.length, _AddElement(() => {addItemToList()}));
    super.initState();
  }

  void addItemToList() {
    var _position = lwidgets.length - 1;
    setState(() {
      lwidgets.insert(
          _position,
          _Adresses(
              indice: _position,
              onDeleteAdress: (int i) => {deleteItemFromList(_position)}));
    });
  }

  void deleteItemFromList(int i) {
    print('remove $i');
    setState(() {
      lwidgets.removeAt(i);
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text('CONTACTS'),
          leading: Icon(Icons.arrow_left),
          actions: <Widget>[
            FlatButton(
              onPressed:
                  () {}, // I want get all values contained of lwidgets. What do i need to do???
              child: Text(
                'SAVE',
                style: TextStyle(color: Colors.white),
              ),
            )
          ],
        ),
        backgroundColor: Color(0xFFE5E5EA),
        body: Column(
          children: <Widget>[
            Text('ADRESSES'),
            Container(
              height: 200,
              child: ListView.builder(
                itemCount: lwidgets.length,
                itemBuilder: (BuildContext context, int index) {
                  return lwidgets[index];
                },
                physics: NeverScrollableScrollPhysics(),
              ),
            ),
          ],
        ));
  }
}

问题在于删除项目时的行为，如果我在ListView中的任何元素上点击“删除”按钮……总是“删除”最后一个。在此示例中，将点击fisrt元素，结果如下：

这是_Adresses小部件的代码：

class _Adresses extends StatelessWidget {
  final int indice;
  final Function(int) onDeleteAdress;

  const _Adresses({this.indice = 0, this.onDeleteAdress});

  @override
  Widget build(BuildContext context) {
    print('Indice $indice');
    return Column(
      children: <Widget>[
        Container(
          height: 40,
          color: Colors.white,
          child: Row(
            children: <Widget>[
              IconButton(
                icon: Icon(Icons.remove_circle),
                iconSize: 24,
                color: Color(0xFFFF3B30),
                onPressed: () {
                  onDeleteAdress(indice);
                },
              ),
              Container(
                width: 100,
                child: TextField(
                  // keyboardType: TextInputType.numberWithOptions(
                  //   signed: false,
                  //   decimal: true,
                  // ),
                  decoration: InputDecoration(
                    hintText: 'Place',
                    border: InputBorder.none,
                  ),
                  style: TextStyle(fontFamily: 'Lekton'),
                ),
              ),
              _VerticalDivider(),
              Container(
                width: 100,
                child: TextField(
                  keyboardType: TextInputType.text,
                  // textCapitalization: TextCapitalization.sentences,
                  decoration: InputDecoration(
                    hintText: 'Street',
                    border: InputBorder.none,
                  ),
                  style: TextStyle(fontFamily: 'Lekton'),
                ),
              ),
              _VerticalDivider(),
              Container(
                width: 100,
                child: TextField(
                  decoration: InputDecoration(
                    hintText: 'Postal Code',
                    border: InputBorder.none,
                  ),
                  style: TextStyle(fontFamily: 'Lekton'),
                ),
              ),
            ],
          ),
        ),
        _HorizontalDivider(),
      ],
    );
  }
}

这是_AddElement小部件的代码

class _AddElement extends StatelessWidget {
  final Function() onAddAdress;

  const _AddElement(this.onAddAdress);

  @override
  Widget build(BuildContext context) {
    return Container(
      height: 40,
      color: Colors.white,
      child: Row(
        children: <Widget>[
          Container(
            height: 40,
            color: Colors.white,
            child: IconButton(
              icon: Icon(Icons.add_circle),
              iconSize: 24,
              color: Color(0xFF34C759),
              onPressed: () {
                onAddAdress();
              },
            ),
          ),
        ],
      ),
    );
  }
}

如果您能给我任何帮助或建议，我将不胜感激。

衷心的Jose Rodriguez

如何在Flutter中动态地从ListViwew中正确删除项目

0 个答案: