Flutter ListView:onDismissed时只调用列表中的一项名称

Flutter ListView: Only one item name on the list is called when onDismissed

我正在使用 ListView.Builder 将我的数据显示到屏幕上,它工作得很好,然后我实现了 Dismiss 和 onDismiss 功能,它们似乎工作正常,但我试图关闭项目 A它会从屏幕上关闭它,但在 showSnackBar 上它显示 Item-Z 已被删除,如果我删除了 item-B 它仍然在 showSnackBar 上给我 item-Z 的名称,我在数据列表中添加了更多项目将 item-Z 现在变成 item-X,但如果我滑动它仍然显示新的 item-Z 已被删除,然后我尝试删除最后一个项目,即 item-Z,它给了我一个错误

[. Exception caught by animation library ═════════════════════════════════ The following RangeError was thrown while notifying listeners for AnimationController: RangeError (index): Invalid value: Not in inclusive range 0..3: 4

When the exception was thrown, this was the stack #0 List.[] (dart:core-patch/growable_array.dart:177:60) #1 _ListsState.build.. package:another_test/list_widget.dart:81. ]

这是下面的代码

import 'package:flutter/material.dart';
import 'package:flutter/foundation.dart';
import './list_model.dart';

class Lists extends StatefulWidget {
  @override
  _ListsState createState() => _ListsState();
}

class _ListsState extends State<Lists> {
  List<ItemLists> items = [
    ItemLists(
      title: 'Best Music of the Year',
      discription: 'Davido',
      favorite: false,
    ),
    ItemLists(
      title: 'Best Album Cover design',
      discription: 'Brighter Press',
      favorite: false,
    ),
    ItemLists(
      title: 'Best Vocalist',
      discription: 'Simi-Sola',
      favorite: false,
    ),
    ItemLists(
      title: 'Best Danced',
      discription: 'Black Camaru',
      favorite: false,
    ),
    ItemLists(
      title: 'Best Performance',
      discription: 'Shofeni-Were',
      favorite: false,
    ),
    ItemLists(
      title: 'Best Act',
      discription: 'You Want to See Craze',
      favorite: false,
    ),
  ];

  @override
  Widget build(BuildContext context) {
    return Container(
      child: ListView.builder(
        scrollDirection: Axis.vertical,
        shrinkWrap: true,
        itemBuilder: (context, index) {
          return Dismissible(
            key: ObjectKey(items[index]),
            background: Container(
              color: Colors.red,
            ),
            child: Card(
                child: ListTile(
              leading: new IconButton(
                  icon: Icon(
                    Icons.star,
                    color: items[index].favorite ? Colors.green : Colors.grey,
                  ),
                  tooltip: 'Add to Favorite',
                  onPressed: () {
                    setState(() {
                      items[index].favorite = !items[index].favorite;
                    });
                  }),
              title: Text('${items[index].title}'),
              subtitle: Text('${items[index].discription}'),
              trailing:
                  IconButton(icon: Icon(Icons.calendar_today), onPressed: null),
            )),
            onDismissed: (direction) {
              // Remove the item from the data source.
              setState(() {
                items.removeAt(index);
              });
              Scaffold.of(context).showSnackBar(
                SnackBar(
                  content: Text('${items[index]?.title} Deleted'),
                ),
              );
            },
          );
        },
        itemCount: items.length,
      ),
    );
  }
}

下面是数据模型代码

class ItemLists {
  String title;
  String discription;
  bool favorite;

  ItemLists({this.title, this.discription, this.favorite});
}

从下面的屏幕截图中,您会看到我删除了另一个项目,但它仍然显示我删除了仍在页面上的最后一个项目

Snackbar 正在尝试获取名称,但该项目此时已被删除。解决方案是在从列表中删除项目之前获取标题名称。

将 onDismissed 更改为:

onDismissed: (direction) {
  // Remove the item from the data source.
  // get the title of the item before it is deleted
  final String myTitle = items[index].title;
  setState(() {
    items.removeAt(index);
  });
  Scaffold.of(context).showSnackBar(
    SnackBar(
      content: Text('$myTitle Deleted'),
    ),
  );
};